无刷新动态加载数据,滚动条加载

无刷新动态加载数据,滚动条加载

 滚屏加载更多数据,适合评论等页面

本例的数据库很简单,一看就明了

无刷新动态加载数据,滚动条加载_第1张图片
演示

 

 

PHP Code
  1.     
  2.   
  3.     
  4.     $query=mysql_query("select * from content order by id desc limit 0,10");   
  5.     while ($row=mysql_fetch_array($query)) {   
  6.     ?>   
  7.        
  8.            
  9.               
   
  •               
  •    
  •          
  •    
  •          
  •    
  •     
  •    
  •        
  •  
  •     
  •    
    js文件
     
    JavaScript Code
    1.   
    2. $(function(){  
    3.     var winH = $(window).height(); //页面可视区域高度  
    4.     var i = 1;  
    5.     $(window).scroll(function () {  
    6.         var pageH = $(document.body).height();  
    7.         var scrollT = $(window).scrollTop(); //滚动条top  
    8.         var aa = (pageH-winH-scrollT)/winH;  
    9.         if(aa<0.02){  
    10.             $.getJSON("result.php",{page:i},function(json){  
    11.                 if(json){  
    12.                     var str = "";  
    13.                     $.each(json,function(index,array){  
    14.                         var str = "";  
    15.                         var str = str + ""+array['date']+"
    ";  
  •                         var str = str + ""+array['author']+"
  • ";  
  •                         var str = str + "
  • "+array['content']+"";  
  •                         $("#container").append(str);  
  •                     });  
  •                     i++;  
  •                 }else{  
  •                     $(".nodata").show().html("别滚动了,已经到底了。。。");  
  •                     return false;  
  •                 }  
  •             });  
  •         }  
  •     });  
  • });  
  •   
  • result.php

    PHP Code
    1. include("conn.php");  
    2.   
    3. $page = intval($_GET['page']);  //获取请求的页数   
    4. $start = $page*5;   
    5. $query=mysql_query("select * from content order by id desc limit $start,5");   
    6. while ($row=mysql_fetch_array($query)) {   
    7.     $arr[] = array(   
    8.         'content'=>$row['message'],   
    9.         'author'=>$row['id'],   
    10.         'date'=>date('m-d H:i',strtotime($row['updatetime']))   
    11.     );   
    12. }   
    13. echo json_encode($arr);  //转换为json数据输出   
    14. ?>  


    原文地址: http://www.freejs.net/article_jquerywenzi_52.html

    作者:piperzero 发表于2013-10-10 16:29:04 原文链接
    阅读:62 评论:0 查看评论

    你可能感兴趣的:(动态加载,数据,加载)