如何知道div的滚动何时到达底部 - JQuery

时间:2013-10-22 07:28:42

标签: javascript jquery html5 scrollbar

当div的滚动到达底部时,如何触发另一个事件。 我不想使用jscroll.com或无限滚动。 使用$(window).bind("scroll", function (){}对我不起作用。 请建议!!

4 个答案:

答案 0 :(得分:1)

试试这个:

$('#div').bind('scroll', function() {
     if($(this).scrollTop() + $(this).innerHeight() >= $(this)[0].scrollHeight)
     {
         alert('bottom');
     }
});

答案 1 :(得分:0)

你可以使用这样的东西......

$("#mydiv").scroll( function() {
if($(this)[0].scrollHeight - $(this).scrollTop() == $(this).outerHeight()) {
// what you want to do ...
}
});

答案 2 :(得分:0)

类似这样的事情

$(window).scroll(function(){
    var window_height = $(window).height();
    var window_scroll = $(window).scrollTop();
    var document_height = $(document).height();

    if (window_height + window_scroll == document_height) {
       alert("bottom");
    } 
});

示例:

demo

答案 3 :(得分:0)

试试这个:

<html>
<body>
<div style="width:100px; height:10000px;background-color:red;"></div>
</body>
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script>
        $(function() {
            $(window).bind("scroll", function (){ 
                console.log("SCROLL : " + $(window).scrollTop() 
                    + " - " + $(window).innerHeight() 
                    + " - " + document.body.clientHeight);
                if ($(window).scrollTop() + document.body.clientHeight >= $(window).innerHeight()) {
                            alert('Bottom!');
                }
            });
        });
</script>
</html>

这适用于chrome,您可能需要将其他命令用于其他浏览器。