Asynchronous pagination - Client Script

    In order to implement an asynchronous pagination, there is a key client technology: how to check if scroll bar has arrived bottom. The following script could solve this question, it comes from address http://blog.csdn.net/zhangking/article/details/5722232

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="content-type" content="text/html;charset=utf-8">
    <title>下拉滚动条滚到底部了吗？</title>
    <script language="javascript" src="jquery-1.4.2.min.js"></script>
    <script language="javascript">
        $(document).ready(function (){
            var nScrollHight = 0; //滚动距离总长(注意不是滚动条的长度)
            var nScrollTop = 0;   //滚动到的当前位置
            var nDivHight = $("#div1").height();

            $("#div1").scroll(function(){
                nScrollHight = $(this)[0].scrollHeight;
                nScrollTop = $(this)[0].scrollTop;
                if(nScrollTop + nDivHight >= nScrollHight)
                    alert("滚动条到底部了");
            });
        });
    </script>
    <body>
        <div id="div1" style="overflow-y:auto; overflow-x:hidden; height:500px;">
            <div style="background-color:#ccc; height:750px;">IE 和 FF 下测试通过</div>
        </div>
    </body>
</html>
View Code

 

posted @ 2013-12-23 09:55  Gold-Bird  阅读(186)  评论(0)    收藏  举报