Jquery无限下滚(仿腾讯,新浪微博效果)

这是仿照腾讯的微薄上的一个效果。滚动条可以无限的网下滚动并且无刷不断从数据库中获取新的数据。

刚开始的时候以为能难，不过做起来还是比较容易。发明难，仿照容易。

代码都带注释。不懂的加C#高级群询问 群号86594082

$(function(){
     var isOK=true;//记录上次访问是否已经结束，如果ajax也有线程就好了
     var scrollH=0;//判断是往上滚还是往下滚
     var  intI=1;

    // loading层是固定在页脚的记录牌

     $(".loading").css({"right":"2","bottom":0});
     $(".loading")
     .ajaxStart(function(){
        isOK=false;//执行ajax的时候把isOK设置成false防止第一次没有执行完的情况下执行第二次易出错
        $("#loading2").show();
          })
     .ajaxStop(function(){
         isOK=true;
          $("#loading2").hide();
         })
    
    $(window).scroll(function(){
     //控制load层     
      document.getElementByIdx_x_x("loading").style.top=document.documentElement.scrollTop+"px";
        //触法ajax条件  可以换算成百分比更好
   if($(document).height()-$(window).scrollTop()-document.documentElement.clientHeight<240）{
      //当前位置比上次的小就是往上滚动不要执行ajax代码块
      if(scrollH>document.documentElement.scrollTopY)
      {
        $(".loading").append("<br/>向上滚不执行")
        scrollH=document.documentElement.scrollTop;//记录新位置
       return;
       }
      if(isOK)//如果是第一次或者上次执行完成了就执行本次
      {

         scrollH=document.documentElement.scrollTop;//记录新位置
         $(".loading").append("<br/>~~<span style='background:#red'>执行了ajax。。。。。</span><br/>")
         isOK=false;
      $.ajax({
          type:"POST",
          dataType: 'xml',
          url:"http://localhost:49302/MY100/2010/WebService1.asmx/getDS",
          error:function(e){
            $(".main").append('发生了错误：'+e)
           },
          success:function(data){
           try{
            $(data).find("Table").each(function(i){
                  $(".main").append("结果："+$(this).children('txtTitle').text()+"<br/>"); 
                  $(".main").append("结果："+$(this).children('txtBody1').text()+"<br/>"); 
                  $(".main").append("结果："+$(this).children('txtBody2').text()+"<br/>"); 
                  $(".main").append("结果："+$(this).children('txtBody3').text()+"<br/>");
                  $(".main").append("结果："+$(this).children('txtBody4').text()+"<br/>");
                  $(".main").append("结果："+$(this).children('ID').text()+"<br/>");
                  })//each
            }
           catch(e){
             $(".main").append("<p>"+e+"</p>")
            }
           }//success
          })//ajax
         }//if(isOK)
         else
         {
           $(".loading").append("<br/>~~你是向下滚了，但是上次还没有执行完毕，等等吧<br/>")
          }
      }// 触法ajax条件  
     })//scroll
    })//Jquery 结束处