zoukankan      html  css  js  c++  java
  • jquery列表自动加载更多

    <!doctype html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>{$Think.lang.E160}</title>
    <link href="__CSS__/css.css" rel="stylesheet">
    <meta name="viewport" content="width=device-width,height=device-height,inital-scale=1.0,maximum-scale=1.0,user-scalable=no;">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="format-detection" content="telephone=no">
    <script src="__JS__/jquery-1.11.1.min.js"></script>
    <script>
    var cur_page = 1;
    var max_page = 0;
    var page_size = 15;
         
    function get_content(){
        var str = '';
        $.post("__URL__/getSysList", {'size':page_size, 'page':cur_page, 'max_page':max_page}, function(s){
    		$('#getMore').hide();
    		
    		s = $.parseJSON(s);
    		
    		//首页进入时的首次加载
    		if(max_page==0) max_page = parseInt(s.maxPage);
            
            for(i in s.list){
                str +=  '<div class="xttz">'+
    					'	<div class="tzyi"><span>'+ s.list[i].sysm_date.date.split(' ')[0] +'</span><b>'+ s.list[i].sysm_title + '</b></div>'+
    					'	<div class="tznr">'+ s.list[i].sysm_content +'</div>'+
    					'</div>';
            }
    
    		cur_page++;
            $("#list_box").append(str);
        });
    }
     
    
    $(function(){
    	
    	//页面回退时优先加载缓存,并自动滚动到原阅读位置
        var con = localStorage.getItem("active_list_con");
        if(con){
            cur_page = localStorage.getItem("active_list_page");
    		max_page = localStorage.getItem("active_list_maxpage");
            $("#list_box").append(con);
            $("html,body").scrollTop(localStorage.getItem("active_list_scroll"));
        }else{
    		//页面进入时自动第一次加载内容
        	get_content();
    	}
     
        $(window).scroll(function() {
            if (($(window).scrollTop() || window.scrollY) + $(window).height() == $(document).height() && cur_page != max_page) {
                $('#getMore').show();
                get_content();
                 
                //加入缓存
                localStorage.setItem("active_list_con", $("#list_box").html());		//已加载的浏览内容
    			localStorage.setItem("active_list_maxpage", max_page);		//当前页面总页数
                localStorage.setItem("active_list_page", cur_page);			//当前页数
                localStorage.setItem("active_list_scroll", $(window).scrollTop());		//当前浏览位置
            }
        });
    
    });
    </script>
    
    <link href="__CSS__/common.css" rel="stylesheet" type="text/css">
    </head>
    
    <body>
    <div class="top"><span><a href="/index.php/Index/Thenews/thenews"><img src="__IMG__/topjt.png" width="70%"></a></span>{$Think.lang.E160}</div>
    
    <div id="list_box"></div>
    
    <div id="getMore" style="position:fixed; left:10%; bottom:0; opacity:0.7; 80%; height:40px; line-height:40px; border-radius:6px 6px 0 0; background:#fff; color:#000; text-align:center;">更多内容正在加载...</div>
    
    </body>
    </html>
    
        //ajax-分页获取最新通知
        public function getSysList(){
            //设置where条件
            $where = "sysm_status=0";
        
            $lang = strtolower(cookie('think_language'))=='en-us' ? 2 : 1;
            $where .= " and sysm_lang={$lang}";
        
            //分页查询
            $page = I('post.page', 1, 'intval');
            $pageSize = I('post.size', 15, 'intval');
            $maxPage = I('post.max_page', 0, 'intval');
            $n = $page * $pageSize;
        
            //总页数,第一次获取的时候查询
            if($maxPage==0){
                $count = M()->query("select count(0) as count from SystemMessages where {$where}");
                $max_page = ceil($count[0]['count'] / $pageSize);
            }
        
            $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";
            $list = M()->query($SQL);
            
            $result = ['maxPage'=>$max_page, 'list'=>$list];
            die(json($result));
        }
    
  • 相关阅读:
    Eclipse集成weblogic教程
    Weblogic项目部署教程
    Eclipse导出WAR包
    Eclipse集成Tomcat教程
    Eclipse错误:The superclass "javax.servlet.http.HttpServlet" was not found on the Java Build Path
    Eclipse导入Oracle/MySQL数库驱动包教程
    Java连接Oracle/MySQL数据库教程
    Oracle常用表和常见操作命令
    VMware如何进入安全模式
    VMware进入BIOS
  • 原文地址:https://www.cnblogs.com/doseoer/p/4445994.html
Copyright © 2011-2022 走看看