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

最新推荐文章于 2021-08-06 03:11:28 发布

扯文艺的猿

最新推荐文章于 2021-08-06 03:11:28 发布

阅读量954

点赞数

分类专栏： phpcms 文章标签：下拉加载

phpcms 专栏收录该内容

7 篇文章 0 订阅

订阅专栏

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

HTML部分

 
      <!--列表--> 
     
      < 
      div  
      id 
      = 
      "lists" 
      > 
     
      <!--本示例显示所有最新文章,根据实际情况自行调整--> 
     
      {pc:get sql="SELECT * FROM `v9_news` where status=99 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部分

 
      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( 
     
 
           
      'status=99 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 
      ); 
     