网站地图 | 联系我们 排名技术建站,让你对手追赶
你现在的位置:网站首页 > 学无止境 > CMS建站教程 > 正文内容


帝国CMS实现点击加载更多

发布时间:2017-12-18 | 编辑 : 小勇 | 分类 : CMS建站教程 | 阅读: 次 | 评论 :0

在制作移动端页面时会用到,把以下代码添加到服务器,按步骤操作即可实现点击加载更多。

1、将以下代码上传至服务器(e/action/)下,命名为getmore.php
 

  1. <?php 
  2.     require('../class/connect.php'); 
  3.     require('../class/db_sql.php'); 
  4.     require('../data/dbcache/class.php'); 
  5.     if($_POST[action] == 'getmorenews'){ 
  6.     $table=htmlspecialchars($_POST[table]); 
  7.     if(emptyempty($_POST[orderby])){$orderby='newstime';}else$orderby=htmlspecialchars($_POST[orderby]);} 
  8.     if(emptyempty($_POST[myorder])){$myorder='desc';}else$myorder='asc';} 
  9.     if(emptyempty($_POST[limit])){$limit=6;}else$limit=(int)$_POST[limit];} 
  10.     if(emptyempty($_POST[classid])){$where=null;}else$where='where classid in('.$_POST[classid].')';} 
  11.     if(emptyempty($_POST[length])){$length=50;}else$length=(int)$_POST[length];} 
  12.     if(emptyempty($_POST[small_length])){$small_length=500;}else$small_length=(int)$_POST[small_length];} 
  13.      
  14.     // next:第几页 
  15.     // table:调用数据表 
  16.     // limit:每次调用数量 
  17.     // small_length:简介截取字符数 
  18.     // length:标题截取字符数 
  19.     // classid:调用栏目,允许多个,如1,2,3,4  特别注意,必须是调用同一数据表的栏目 
  20.     // orderby:排序,默认是newstime,传什么就按什么来排序,如 id 
  21.     // myorder:正反序,默认是asc,传值怎为desc 
  22.     $link=db_connect(); 
  23.     $empire=new mysqlquery(); 
  24.     $num =(int)$_POST['next'] *$limit
  25.       
  26.       if($table){ 
  27.             $sql=$empire->query("SELECT * FROM `".$dbtbpre."ecms_".$table."` $where order by $orderby $myorder limit $num,$limit"); 
  28.       
  29.         while($r=$empire->fetch($sql)){ 
  30.       
  31.             if($r[mtitlepic]==''){  
  32.                 $r[mtitlepic]=$public_r[news.url]."e/data/images/notimg.gif"
  33.             } 
  34.         $oldtitle=stripSlashes($r[title]); 
  35.         $title=sub($oldtitle,'',$length); 
  36.         $smalltext=stripSlashes($r[smalltext]); 
  37.         $smalltext=sub($smalltext,'',$small_length); 
  38.         $classname=$class_r[$r[classid]][classname]; 
  39.         $newsurl=$public_r[newsurl]; 
  40.         $classurl=$newsurl.$class_r[$r[classid]][classpath]; 
  41.         $urls = sys_ReturnBqTitleLink($r); 
  42.       
  43.     ?> 
  44.     <!-- 以下代码是显示列表的标签模板 --> 
  45.     <li class='news-list'
  46.         <a href='<?=$urls?>' title='<?=$r[title]?>' class='date-link'
  47.             <img src='<?=$r[mtitlepic]?>' alt='<?=$r[title]?>'  class='date-img-url'/> 
  48.             <h4 class='date-title'><?=$r[title]?></h4><span class='act-datetime'><?=date("Y-m-d",$r[newstime])?></span> 
  49.         </a> 
  50.     </li> 
  51.  
  52.     <?php 
  53.         } 
  54.        } 
  55.     } 
  56.     db_close(); 
  57.     $empire=null; 
  58. ?> 

2、在帝国CMS模板后台,在对应的列表页面添加以下代码

页面模板内容(*)
 

  1. <ul class="list-content  clear" id="showajaxnews">[!--empirenews.listtemp--]<!--list.var1-->[!--empirenews.listtemp--]</ul>    
  2. <div class="more" id="loadmore">点击加载更多内容</div> 
  3. <!-- 需要引入JQ文件 --> 
  4. <script> 
  5. $(function(){    
  6.      var i = 1; //设置当前页数 
  7.     $('#loadmore').click(function(){ 
  8.         $.ajax({ 
  9.             url : 'http://localhost/cms/e/action/getmore.php',  // 这是当前服务器的地址 
  10.             type:'POST'
  11.             data:{"next":i,'table':'news','classid':'[!--self.classid--]','action':'getmorenews','limit':10,'small_length':120}, 
  12.             dataType : 'html'
  13.             beforeSend:function(){ 
  14.                 $("#loadmore").show().html('<img src="/images/loaduai.gif" width=23/>  正在努力加载中...'); 
  15.                    $('#loadmore').attr('disabled','disabled'); 
  16.             }, 
  17.             success : function(data){ 
  18.                 if(data){ 
  19.                     $("#showajaxnews").append(data); 
  20.                     $("#loadmore").removeAttr('disabled'); 
  21.                     $("#loadmore").html('点击加载更多'); 
  22.                     i++; 
  23.                 }else
  24.                     $("#loadmore").show().html("已全部加载完毕!"); 
  25.                     $('#loadmore').attr('disabled','disabled'); 
  26.                     return false; 
  27.                 }      
  28.             } 
  29.         }); 
  30.     }); 
  31. }); 
  32. </script> 

列表内容模板(list.var) (*)

 

  1. <li class='news-list'
  2.     <a href='[!--news.url--]' title='[!--title--]' class='date-link'
  3.         <img src='[!--titlepic--]' alt='[!--title--]'  class='date-img-url'/> 
  4.         <h4 class='date-title'>[!--title--]</h4><span class='act-datetime'>[!--newstime--]</span> 
  5.     </a> 
  6. </li> 


 

本文标签帝国   更多  

赞助我们:如果你觉得本站的内容对你确实有所帮助,请赞助我们让我们有动力为你继续奉献更多有用的内容→赞助我们

版权说明:如非注明,本站文章均为 小勇工作室 原创,转载请注明出处和附带本文链接 http://www.yl0797.com/html/2017/learning_1218/334.html。


联系我们
QQ:
873268813
旺旺:
wsuper勇
邮箱:
给我发邮件
QQ群:
加入交流群

Powered By 小勇工作室,Copyright www.yl0797.com © 2008-2019, 赣ICP备15004575号