zoukankan      html  css  js  c++  java
  • 动态分页《查看更多》

    $(document).ready(function(){
         var range = 50;             //距下边界长度/单位px 
         var elemt = 500;           //插入元素高度/单位px 
         var maxnum = $("#newsCount").val();            //设置加载最多次数 
         var num = 1;
         var page = 1;
         var totalheight = 0;  
         var main = $("#content");                     //主体元素 
         $(window).scroll(function(){ 
             var srollPos = $(window).scrollTop();    //滚动条距顶部距离(页面超出窗口的高度) 
             totalheight = parseFloat($(window).height()) + parseFloat(srollPos);
            
             if(($(document).height()-range) <= totalheight  && num != maxnum) {
              $.ajax({
               type:"post",
               url: "${path}/main_do/ajaxNews",
               data: {
                 page: page
                },
               dataType: "html",
               success: function(data){
                 var objs = jQuery.parseJSON(data);
                 for(var i=0;i<objs.length;i++)
                 {
                  var news = objs[i];
                 
                  main.append('<div class="index_one_news"><div class="index_one_news_img"><img src="${path }/'+news.image+'" width="182" height="109" /></div><div class="index_one_news_text"><a href="${path }/main_do/news_detail?newsId='+news.news_ID+'"><h1>'+news.title+'</h1></a><p>'+news.content+'</p><div class="index_one_news_date">'+news.publish_Date+'</div></div></div>');
                 }
               },
               error: function(){
                
               }
              });
              page++;
                 num++; 
             } 
         }); 

  • 相关阅读:
    vue 单页面应用 app自适应方案
    css3-3D特效
    css3动画-transition
    html5基本页面
    初入博客园
    网络部分之如何发送HTTP请求
    多线程知识之NSOperation的使用
    多线程知识点之GCD的使用
    多线程知识点之NSThread的使用
    plist 文件读写
  • 原文地址:https://www.cnblogs.com/dieyf/p/4273897.html
Copyright © 2011-2022 走看看