帝国cms7.2点击加载更多源代码,手机ajax加载更多代码帝国cms7.2点击加载更多源代码,手机ajax加载更多代码

生命不息,
折腾不止!

帝国cms7.2点击加载更多源代码,手机ajax加载更多代码

很多朋友还是反映不知道怎么在帝国cms下加载更多代码的使用,在当下制作手机站热门的情况下没有这个代码的确是对访问体验不太好,今天分享给大家源代码:首先看体验站,我自己的站样式你不是你想要的。地址:http://m.wenzhaihui.com/mmm/

其实很简单,关键是怎么连接数据库。在前边的这边文章中有详细的介绍


帝国cms7.2 无刷新 Ajax 加载更多列表信息源代码,手机加载更多

get_news_index.php

<?php
require('../class/connect.php');
require('../class/db_sql.php');
require('../data/dbcache/class.php');
if($_POST[action] == 'getmorenews'){
$table=htmlspecialchars($_POST[table]);
if(empty($_POST[orderby])){$orderby='newstime';}else{ $orderby=htmlspecialchars($_POST[orderby]);}
if(empty($_POST[myorder])){$myorder='desc';}else{ $myorder='asc';}
if(empty($_POST[limit])){$limit=15;}else{ $limit=(int)$_POST[limit];}
if(empty($_POST[classid])){$where=null;}else{ $where='where classid in('.$_POST[classid].')';}
if(empty($_POST[length])){$length=50;}else{ $length=(int)$_POST[length];}
if(empty($_POST[small_length])){$small_length=500;}else{ $small_length=(int)$_POST[small_length];}
 
$link=db_connect();
$empire=new mysqlquery();
$num =(int)$_POST['next'] *$limit;
 
  if($table){
        $sql=$empire->query("SELECT * FROM `".$dbtbpre."ecms_".$table."` $where order by $orderby $myorder limit $num,$limit");
 
    while($r=$empire->fetch($sql)){
 
        if($r[titlepic]==''){ 
            $r[titlepic]=$public_r[news.url]."e/data/images/notimg.gif";
        }
    $oldtitle=stripSlashes($r[title]);
    $title=sub($oldtitle,'',$length);
    $smalltext=stripSlashes($r[smalltext]);
    $smalltext=sub($smalltext,'',$small_length);
    $classname=$class_r[$r[classid]][classname];
    $newsurl=$public_r[newsurl];
    $classurl=$newsurl.$class_r[$r[classid]][classpath];
 
?>
            <div class="latest_news_list fixed">
                <div class="news_cover">
                    <a href="<?=$r[titleurl]?>" target=_blank><img src="<?=$r[titlepic]?>" width=160 height=100 /></a>
                </div>
                <div class="news_text">
                    <h3><a href="<?=$r[titleurl]?>" target=_blank><?=$r[title]?></a></h3>
                    <p><?=$smalltext?></p>
                    <p><span class="timmer fr"><?=date("Y-m-d",$r[newstime])?></span><a href="<?=$classurl?>"><?=$classname?></a></p>
                </div>
            </div>
<?php
    }
   }
}
db_close();
$empire=null;
?>

前端JS脚本实现代码:

 $(function(){    
 
     var i = 1; //设置当前页数
      
    $('#loadmore').click(function(){
 
        $.ajax({
        url : '/e/action/get_news_index.php',
                type:'POST',
                data:{"next":i,'table':'news','action':'getmorenews','limit':15,'small_length':120},
            dataType : 'html',
        beforeSend:function(){
                $("#loadmore").show().html('<img  src="/e/extend/Ajaxpl/template/loading1.gif" width=80/>正在努力加载中...');
           $('#loadmore').attr('disabled','disabled');
        },
            success : function(data){
           if(data){
               $("#showajaxnews").append(data); 
                          $("#loadmore").removeAttr('disabled');
              $("#loadmore").html('点击加载更多');
                 i++;
            }else{
                $("#loadmore").show().html("已全部加载完毕!");
                        $('#loadmore').attr('disabled','disabled');
                return false;
            }      
           }
        });
    });
});

ajax请求服务端参数说明

  • next:第几页
  • table:调用数据表
  • limit:每次调用数量
  • small_length:简介截取字符数
  • length:标题截取字符数
  • classid:调用栏目,允许多个,如1,2,3,4 特别注意,必须是调用同一数据表的栏目
  • orderby:排序,默认是newstime,传什么就按什么来排序,如 id
  • myorder:正反序,默认是asc,传值怎为desc

除此之外你还需要有一个按钮来载入更多 

<button  id="loadmore">点击加载更多内容</button>

还需要一个渲染数据的元素(id="showajaxnews")点击加载更多按钮后获取到的数据会追加到showajaxnews元素里面,在点击载入按钮之前我们需要预放一下数据在里面,这样的话打开页面就有部分数据,点击载入按钮后追加到末尾!

div  id="showajaxnews" ></div>

参考模板代码

参考模板代码

参考模板代码

原网址 http://www.wenzhaihui.com/wenzhaihui/ITwenzhang/2015-08-14/7749.html


 

但还是很多人不知道。我建议你可以先把首页模板空出来,单独做一个加载更多的实验,看看代码是怎么用的,你就明白了。

共分3步。

第一步,将以下代码复制到帝国首页模板:

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Ajax点击后载入更多在本页,无刷新</title>
<script type="text/javascript" src="jquery-1.9.1.min.js"></script>
<script src="loadNews.js" type="text/javascript"></script>
</head>
<body>
<div  id="showajaxnews" >[phomenews]0,10,32,0,3,0,'(m-d)'[/phomenews]</div>
<button  id="loadmore">点击加载更多内容</button>
</div>
</body>
</html>

第二步,上传jquery-1.9.1.min.js文件get_news_index.php文件loadNews.js文件到你的网站根目录。

下载地址:http://www.wenzhaihui.com/xiazai/jiazai.zip

本地下载:jiazai.zip (34.31 KB)

第三步,测试就可以了,这个是以新闻数据库来做的,你可以测试下,看看原理。

不明白的可以仔细看看

这个帖子 http://www.wenzhaihui.com/wenzhaihui/ITwenzhang/2015-08-14/7749.html

修改显示的样式在get_news_index.php中,用软件打开修改就可以了。

赞() 打赏
未经允许不得转载:我的博客 » 帝国cms7.2点击加载更多源代码,手机ajax加载更多代码
分享到: 更多 (0)

评论 4

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址
  1. #1

    这是评论测试

    DUX主题小秘7个月前 (09-17)回复
    • 飞歌导航东方红烦得很

      themebetter主题小秘3周前 (04-08)回复
  2. #2

    这是新的一条评论

    DUX主题小秘7个月前 (09-17)回复
  3. #3

    未来一年,中国的移动支付市场会是什么样?

    DUX主题小秘7个月前 (09-17)回复

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏

大前端WP主题 更专业 更方便

联系我们 联系我们