写一个类似微薄的滚动加载

    滚动加载是指：当用户滚动滚动条查看页面内容的同时，页面异步加载未加载的内容，构造一种良好的用户体验。滚动加载的思想是，使用setInterval不停的执行函数A，在函数A中作出判断，如下：当滚动条接近页面底部时，使用ajax异步加载页面。

     解决此问题的关键是如果滚动条到达了页面底部：

         var n1 =  parseInt( document.documentElement.scrollTop) );
         var n2 = parseInt(document.documentElement.clientHeight);
         var n3 = parseInt(document.documentElement.scrollHeight);

    当n1+n2==n3的时候，滚动条的位置则处于页面最低端。

     代码如下：

          (function($) {
    var run_interval,run_num = 0;
    $.scrollLoad = function() {
           
        run_interval = setInterval(function(){
            cando();
        }, 1000);//每隔2秒钟调用一次cando函数来判断当前滚动条位置。
       
        $(window).scroll(function()
        {
            run_num = 0;
        });
    };
   
    function showContent() {
        for(var i = 0 ; i < 10 ; i ++)
        {
            $('#mypage').append('你好，我已经被加载出来了<br />');
        }
        $('#mypage').append('<br />');
    }
   
    function cando(){
        var n1 =  parseInt( getScrollTop() );
        var n2 = parseInt(document.documentElement.clientHeight);
        var n3 = parseInt(document.documentElement.scrollHeight);
        if( (n1+n2) == n3 )
        {
             if(run_num == 0)
             {
                 setTimeout( function(){
                    showContent()
                 },500);
                 run_num = 1;
             }
        }   
    }
    function getScrollTop()
    {
        var t =  0;
        if (document.documentElement && document.documentElement.scrollTop) {
            t = document.documentElement.scrollTop;
        } else if (document.body) {
            t = document.body.scrollTop;
        }
        return t;
    }
}(jQuery));

这里提出几点优化意见：

     第一，用ajax异步加载页面内容的时候，如果已经没有数据，用clearInterval清除函数调用。

     第二，异步加载是，一定要用setTimeOut设置延时，不然页面会很卡。

     第三，最好不要无止尽加载。所谓无止境加载就是页面一直加载下去。个人建议，加载几页数据的后，应该由用户决定是否继续加载跟多内容。如，使用“点击查看更多内容进行提示”，如用户点击才继续加载。

     第四，代码中run_num用于防止多次加载，至于为何会酿成多次加载，原因未知。