zoukankan      html  css  js  c++  java

  • 滚动加载更多内容

    本例与《无刷新动态加载数据，滚动条加载》功能是相同的，自己查看用哪个更好.

    数据库很简单content表 字段id和message

    滚动加载更多内容
    演示

     

    XML/HTML Code
    1. <?php  
    2. include_once('../../conn.php');  
    3.   
    4.   
    5. $last_msg_id=$_GET['last_msg_id'];  
    6. $action=$_GET['action'];  
    7.   
    8. if($action <> "get")  
    9. {  
    10. ?>  
    11.   
    12. <link rel="stylesheet" href="css.css" type="text/css" />  
    13. <script type="text/javascript" src="../../js/jquery-1.9.1.min.js"></script>  
    14.       
    15.     <script type="text/javascript">  
    16.     $(document).ready(function(){  
    17.               
    18.         function last_msg_funtion()   
    19.         {   
    20.              
    21.            var ID=$(".message_box:last").attr("id");  
    22.             $('div#last_msg_loader').html('<img src="bigLoader.gif">');  
    23.             $.post("index.php?action=get&last_msg_id="+ID,  
    24.               
    25.             function(data){  
    26.                 if (data != "") {  
    27.                 $(".message_box:last").after(data);           
    28.                 }  
    29.                 $('div#last_msg_loader').empty();  
    30.             });  
    31.         };    
    32.           
    33.         $(window).scroll(function(){  
    34.             if  ($(window).scrollTop() == $(document).height() - $(window).height()){  
    35.                last_msg_funtion();  
    36.             }  
    37.         });   
    38.           
    39.     });  
    40.       
    41.       
    42.     </script>  
    43. <link rel="stylesheet" type="text/css" href="../demo.css">  
    44. </head>  
    45. <body>  
    46.   
    47. <div align="center">  
    48. <?php  
    49.   
    50. include('load_first.php');  
    51.   
    52. ?>  
    53. <div id="last_msg_loader"></div>  
    54. </div>  
    55.   
    56. </div>  
    57. </body>  
    58. </html>  
    59.   
    60.   
    61. <?php  
    62. }  
    63. else  
    64. {  
    65.    
    66. include('load_second.php');       
    67.       
    68.         }  
    69. ?>    
    70.           

     load_first.php

    PHP Code
    1. <?php  
    2. $sql=mysql_query("SELECT * FROM content ORDER BY id DESC LIMIT 15");  
    3. while($row=mysql_fetch_array($sql))  
    4.         {  
    5.         $msgID= $row['id'];  
    6.         $msg= $row['message'];  
    7.   
    8. ?>  
    9. <div id="<?php echo $msgID; ?>"  align="left" class="message_box" >  
    10. <span class="number"><?php echo $msgID; ?></span><?php echo $msg; ?>   
    11. </div>  
    12.   
    13. <?php  
    14. }  
    15. ?>  

    load_second.php

    PHP Code
    1. <?php  
    2. $last_msg_id=$_GET['last_msg_id'];  
    3.  $sql=mysql_query("SELECT * FROM content WHERE id < '$last_msg_id' ORDER BY id DESC LIMIT 5");  
    4.  $last_msg_id="";  
    5.   
    6.         while($row=mysql_fetch_array($sql))  
    7.         {  
    8.         $msgID= $row['id'];  
    9.         $msg= $row['message'];  
    10.     ?>  
    11.           
    12.         <div id="<?php echo $msgID; ?>"  align="left" class="message_box" >  
    13. <span class="number"><?php echo $msgID; ?></span><?php echo $msg; ?>   
    14. </div>  
    15.           
    16.   
    17. <?php  
    18. }  
    19. ?>  

     


    原文地址:http://www.freejs.net/article_jquerywenzi_86.html
  • 相关阅读:
    spring整合Quartz
    Quartz基本使用
    hibernate框架基础描述
    POI技术实现对excel的导出
    CG-CTF CRYPTO部分wp
    CG-CTF web部分wp
    快速排序算法的c++实现
    tornado当用户输入的URL无效时转入设定的页面
    sicily 4699. 简单哈希
    unbutu下Io language的解释器安装
  • 原文地址：https://www.cnblogs.com/suncoolcat/p/3424107.html
Copyright © 2011-2022 走看看