PHPCMS V9 实现下拉加载的方法,兼容手机端(附源码下载)

来自:互联网
时间:2019-02-22
阅读:

PHPCMS V9 实现下拉加载的方法,兼容手机端

HTML部分

<!--列表--> 
<div id="lists"> 
    <!--本示例显示所有最新文章,根据实际情况自行调整--> 
    {pc:get sql="SELECT * FROM `v9_news` Order by updatetime DESC " num="10"} 
    {loop $data $n $r} 
  
    <a href="{$r[url]}"> 
      <img src="{thumb($r[thumb],520,160)}"> 
      <!--自动缩放裁剪图片大小520x160--> 
      <dl> 
          <dt>[{$CATEGORYS[$r[catid]][catname]}] {$r[title]} - {date('m/d',$r[inputtime])}</dt> 
          <!--$CATEGORYS 调用缓存栏目名称--> 
          <dd>{str_cut($r[description],200)}</dd> 
          <!--描述截取200个字符--> 
      </dl> 
    </a> 
  
    {/loop}   
    {/pc}  
  
</div> 
<!-- 
  
    示例: 
  
    {链接} 
    {图片} 
    [{栏目}]{标题} - {时间} 
    {描述} 
  
--> 
  
  
  
<!--加载提示--> 
<div id="loading" style="display:none"></div>

JavaScript脚本部分

<script> 
$(function(){ 
  var pager=1; /*定义开始页码*/ 
  var controller=true; /*定义控制器,防止重复加载*/ 
  $(window).scroll(function() {  
  /*监听滚动事件*/ 
      /*当内容滚动到底部时加载新的内容(注:当距离最底部100个像素时开始加载)*/ 
      if ($(this).scrollTop() + $(window).height() + 100 >= $(document).height() && $(this).scrollTop() > 100) { 
         $("#loading").html("加载中,请稍后...").show(); /*打开加载提示*/  
         if(controller==true){/*如果控制器是开的*/ 
            controller=false;/*关闭加载*/ 
            pager=pager+1;/*当前要加载的页码*/   
            $.getJSON("{APP_PATH}api.php?op=autoload&page="+pager, function(data){ 
  
                  var i=0; 
  
                  $.each(data,function(r){ 
                      i++; 
  
                      var html='<a href="'+data[r].url+'"><img src="'+data[r].thumb+'"><dl><dt>['+data[r].catname+'] '+data[r].title+' - '+data[r].updatetime+'</dt><dd>'+data[r].description+'</dd></dl></a>'; 
                        
                      /*示例 
  
                      var html='<a href="'+data[r].url+'"> 
                        <img src="'+data[r].thumb+'"> 
                        <dl> 
                            <dt>['+data[r].catname+'] '+data[r].title+' - '+data[r].updatetime+'</dt> 
                            <dd>'+data[r].description+'</dd> 
                        </dl> 
                      </a>'; 
  
                      */ 
  
                      $("#lists").append(html);/*追加到列表中*/ 
  
                  });/*end each*/ 
  
                  controller=true;/*开启加载*/ 
                  $("#loading").hide(); /*关闭加载提示*/  
  
                  if(i==0){  
                     $("#loading").html("已经全部加载完").show();   
                  } 
  
              });/*end getJSON*/ 
          
          
          }/*end if*/ 
            
      }/*end if*/ 
    });/*end scroll*/   
});/*end function*/ 
</script>

PHP部分(autoload.php)

defined('IN_PHPCMS') or exit('No permission resources.');  
  
$db = ''; 
#加载内容模型 
$db = pc_base::load_model('content_model'); 
#重定义加载的表名 
$db->table_name = 'v9_news'; 
  
#加载缓存中的栏目名称,注 category_content_站点ID 
$CATEGORYS = getcache('category_content_1','commons'); 
  
$page=isset($_GET['page'])?intval($_GET['page']):1; 
#判断传入的page是否存在 
  
#查询表数据 
$data = $db->select( 
    'ORDER BY `id` DESC LIMIT '.($page-1)*10 .' , ' . 10 .' '#根据实际情况调整where语句 
    ,'id,catid,title,style,thumb,description,url,updatetime,inputtime,username' #需要调取的字段,如需要全部字段则删除本段 
); 
  
#定义数组容器 
$array=array(); 
#遍历查询到的数组,注:如不需要对 图片、时间、栏目进行转换可跳过遍历直接将$data输出 
foreach ($data as $key => $value) { 
        $array[]=array( 
            "id"=>$value['id'], 
            "title"=>$value['title'], 
            "style"=>$value['style'], 
            "thumb"=>$value['thumb']?thumb($value['thumb'],520,160):"", 
            "description"=>str_cut($value['description'],200), 
            "url"=>$value['url'], 
            "updatetime"=>date('m/d',$value['updatetime']), 
            "inputtime"=>date('m/d',$value['inputtime']), 
            "username"=>$value['username'], 
            "catname"=>$CATEGORYS[$value['catid']]['catname'] 
        ); 
} 
  
  
#将数组转换为json数据并输出 
echo json_encode($array);

源码打包下载:https://pan.baidu.com/s/13d_qjG3bFgx2Kl2ldwGP2A  密码:xxvv

返回顶部
顶部