1. <!doctype html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>{$Think.lang.E160}</title>
  6. <link href="__CSS__/css.css" rel="stylesheet">
  7. <meta name="viewport" content="width=device-width,height=device-height,inital-scale=1.0,maximum-scale=1.0,user-scalable=no;">
  8. <meta name="apple-mobile-web-app-capable" content="yes">
  9. <meta name="apple-mobile-web-app-status-bar-style" content="black">
  10. <meta name="format-detection" content="telephone=no">
  11. <script src="__JS__/jquery-1.11.1.min.js"></script>
  12. <script>
  13. var cur_page = 1;
  14. var max_page = 0;
  15. var page_size = 15;
  16.      
  17. function get_content(){
  18.     var str = '';
  19.     $.post("__URL__/getSysList", {'size':page_size, 'page':cur_page, 'max_page':max_page}, function(s){
  20. $('#getMore').hide();
  21.  
  22. s = $.parseJSON(s);
  23.  
  24. //首页进入时的首次加载
  25. if(max_page==0) max_page = parseInt(s.maxPage);
  26.         
  27.         for(i in s.list){
  28.             str += '<div class="xttz">'+
  29. ' <div class="tzyi"><span>'+ s.list[i].sysm_date.date.split(' ')[0] +'</span><b>'+ s.list[i].sysm_title + '</b></div>'+
  30. ' <div class="tznr">'+ s.list[i].sysm_content +'</div>'+
  31. '</div>';
  32.         }
  33.  
  34. cur_page++;
  35.         $("#list_box").append(str);
  36.     });
  37. }
  38.  
  39.  
  40. $(function(){
  41.  
  42. //页面回退时优先加载缓存,并自动滚动到原阅读位置
  43.     var con = localStorage.getItem("active_list_con");
  44.     if(con){
  45.         cur_page = localStorage.getItem("active_list_page");
  46. max_page = localStorage.getItem("active_list_maxpage");
  47.         $("#list_box").append(con);
  48.         $("html,body").scrollTop(localStorage.getItem("active_list_scroll"));
  49.     }else{
  50. //页面进入时自动第一次加载内容
  51.      get_content();
  52. }
  53.  
  54.     $(window).scroll(function() {
  55.         if (($(window).scrollTop() || window.scrollY) + $(window).height() == $(document).height() && cur_page != max_page) {
  56.             $('#getMore').show();
  57.             get_content();
  58.              
  59.             //加入缓存
  60.             localStorage.setItem("active_list_con", $("#list_box").html()); //已加载的浏览内容
  61. localStorage.setItem("active_list_maxpage", max_page); //当前页面总页数
  62.             localStorage.setItem("active_list_page", cur_page); //当前页数
  63.             localStorage.setItem("active_list_scroll", $(window).scrollTop()); //当前浏览位置
  64.         }
  65.     });
  66.  
  67. });
  68. </script>
  69.  
  70. <link href="__CSS__/common.css" rel="stylesheet" type="text/css">
  71. </head>
  72.  
  73. <body>
  74. <div class="top"><span><a href="/index.php/Index/Thenews/thenews"><img src="__IMG__/topjt.png" width="70%"></a></span>{$Think.lang.E160}</div>
  75.  
  76. <div id="list_box"></div>
  77.  
  78. <div id="getMore" style="position:fixed; left:10%; bottom:0; opacity:0.7; width:80%; height:40px; line-height:40px; border-radius:6px 6px 0 0; background:#fff; color:#000; text-align:center;">更多内容正在加载...</div>
  79.  
  80. </body>
  81. </html>
  1. //ajax-分页获取最新通知
  2. public function getSysList(){
  3. //设置where条件
  4. $where = "sysm_status=0";
  5.  
  6. $lang = strtolower(cookie('think_language'))=='en-us' ? 2 : 1;
  7. $where .= " and sysm_lang={$lang}";
  8.  
  9. //分页查询
  10. $page = I('post.page', 1, 'intval');
  11. $pageSize = I('post.size', 15, 'intval');
  12. $maxPage = I('post.max_page', 0, 'intval');
  13. $n = $page * $pageSize;
  14.  
  15. //总页数,第一次获取的时候查询
  16. if($maxPage==0){
  17. $count = M()->query("select count(0) as count from SystemMessages where {$where}");
  18. $max_page = ceil($count[0]['count'] / $pageSize);
  19. }
  20.  
  21. $SQL = "SELECT a.sysmid, a.sysm_title, a.sysm_content, a.sysm_date FROM SystemMessages a, (SELECT TOP {$pageSize} sysmid FROM ( SELECT TOP {$n} sysmid FROM SystemMessages WHERE {$where} ORDER BY sysmid DESC ) t ORDER BY t.sysmid ASC ) b WHERE a.sysmid = b.sysmid ORDER BY a.sysmid DESC";
  22. $list = M()->query($SQL);
  23.  
  24. $result = ['maxPage'=>$max_page, 'list'=>$list];
  25. die(json($result));
  26. }

jquery列表自动加载更多的更多相关文章

  1. jQuery自动加载更多程序

    1.1.1 摘要 现在,我们经常使用的微博.微信或其他应用都有异步加载功能,简而言之,就是我们在刷微博或微信时,移动到界面的顶端或低端后程序通过异步的方式进行加载数据,这种方式加快了数据的加载速度,由 ...

  2. 基于JQuery实现滚动到页面底端时自动加载更多信息

    基于JQuery实现滚动到页面底端时自动加载更多信息 关键代码: 代码如下: var stop=true; $(window).scroll(function(){ totalheight = par ...

  3. jQuery自动加载更多程序(转)

    jQuery自动加载更多程序   1.1.1 摘要 现在,我们经常使用的微博.微信或其他应用都有异步加载功能,简而言之,就是我们在刷微博或微信时,移动到界面的顶端或低端后程序通过异步的方式进行加载数据 ...

  4. UWP-ListView到底部自动加载更多数据

    原文:UWP-ListView到底部自动加载更多数据 ListView绑定的数据当需要“更多”时自动加载 ListView划到底部后,绑定的ObservableCollection列表数据需要加载的更 ...

  5. ListView下拉刷新,上拉自动加载更多

    下拉刷新,Android中非常普遍的功能.为了方便便重写的ListView来实现下拉刷新,同时添加了上拉自动加载更多的功能.设计最初是参考开源中国的Android客户端源码.先看示例图.       ...

  6. jQuery上拉加载更多

    <header id="header">首 页</header> <section id="main"> <ul id ...

  7. Jquery点击加载更多

    一.点击加载更多有点像分页获取数据类似,下面是本人写的一个简单的小例子 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitiona ...

  8. 实现Android ListView 自动加载更多内容

    研究了几个小时终于实现了Android ListView 自动加载的效果. 说说我是怎样实现的.分享给大家. 1.给ListView增加一个FooterView,调用addFooterView(foo ...

  9. Android RecyclerView 瀑布流滑动到最后自动加载更多

    mRecycleView.setOnScrollListener(new RecyclerView.OnScrollListener(){ //用来标记是否正在向最后一个滑动,既是否向下滑动 bool ...

随机推荐

  1. 完美匹配(matching)

    完美匹配(matching) 题目描述 给定nn个点,mm条边的无向图G=(V,E)G=(V,E),求出它的完美匹配数量对106+3106+3取模的值. 一个完美匹配可以用一个排列ϕ:V→Vϕ:V→V ...

  2. kubernetes 数据持久化之Glusterfs

    1.GlusterFS  部署过程请参考上篇文章 2.配置endpoints [root@manager ~]# cat glusterfs-endpoints.json { "kind&q ...

  3. Object.keys(obj)

    对象.keys 很明显是获得对象的key的一个数组 数组的key arr = ['a', 'b', 'c']; console.log(Object.keys(arr)); // console: [ ...

  4. TJOI2015题解

    (转载前请标明出处,谢谢) 打算来做一波TJOI2015,来写题解啦! Day1: T1:[bzoj3996] 题目链接:http://www.lydsy.com/JudgeOnline/proble ...

  5. Java语法糖(一)

    概述 语法糖(Syntactic Sugar):主要作用是提高编码效率,减少编码出错的机会. 解语法糖发生在Java源码被编译成Class字节码的过程中,还原回简单的基础语法结构. 语法糖之一:泛型( ...

  6. HDU 4328 Cut the cake

    Cut the cake Time Limit: 6000/3000 MS (Java/Others)    Memory Limit: 65536/65536 K (Java/Others)Tota ...

  7. CSDN数据库下载地址 CSDN 用户名密码泄漏,600万数据下载

    原文发布时间为:2011-12-21 -- 来源于本人的百度文章 [由搬家工具导入] 12月21日消息,下午有网友爆料称国内最大的开发者社区CSDN.NET的安全系统遭到黑客攻击,CSDN数据库中的6 ...

  8. 关于expect脚本输出的问题

    写了一个expect脚本 执行ssh命令远程登录 然后telnet另外一台机器 大致如下: #!/usr/bin/expect -f set timeout set port_type [lindex ...

  9. MQ 分拆Json数据包然后上传

    public void UploadInsurHistory() { using (IDbConnection connection = ConnConfig.DmsConnection) { IDb ...

  10. Chrome 75 将原生支持图片懒加载

    4 月 6 日,Google 的 Chrome & Web 平台工程经理 Addy Osmani 在个人博客发文,介绍到 <img> 和 <iframe> 的 load ...