Question

我用同样的方法来检测用户何时骂下整个页面：

 $(window).scroll(function(){
    var diff = $(window).scrollTop() + $(window).height() - $(document).height();
    if  ($(window).scrollTop() == $(document).height() - $(window).height()   || (diff < 5 && diff > -5)){
           console.log('yay!');
    }
 });

我想在对话框中做同样的事情，

我这样想：

$('#dialog').dialog();
$('#dialog').scroll(function(){
     var scroll = $('#dialog').scrollTop();
    var height = $('#dialog ul').outerHeight(true);
    if(scroll == height){
         $('#dialog').css('background','#999');
    }else{
        console.log('scrolltop is '+scroll+' and height is: '+height);
    }
})

样本：

http://jsfiddle.net/AgFXz/

我猜的问题是我没有检索整个#dialog大小但是可见（CSS Defined属性）大小..

我怎么知道用户何时滚动直到对话框的滚动结束？

谢谢！

Answer 1

使用$('#dialog ul')[0].scrollHeight获取元素的滚动高度，然后减去实际高度$('#dialog ul').outerHeight(true);，以了解用户何时滚动到底部。

var height = $('#dialog ul')[0].scrollHeight - $('#dialog ul').outerHeight(true);

DEMO

这是控制台日志所说的内容（我每次都单击向下箭头）

scrolltop is 40 and height is: 250
scrolltop is 80 and height is: 250
scrolltop is 120 and height is: 250
scrolltop is 160 and height is: 250
scrolltop is 200 and height is: 250
scrolltop is 240 and height is: 250

最后，scroll和height都是250.这不会显示在日志中，但如果您手动检查它，您会看到。

$('#dialog').scrollTop();
250

Answer 2

您是否尝试过scrollHeight属性？

https://developer.mozilla.org/en/DOM/element.scrollHeight

Answer 3

众所周知，你应该使用scrollHeight 但是你的演示中还有另一个问题：

#dialog ul{
    height:150px;
}

当然$('#dialog ul').outerHeight(true)和$('#dialog ul').innerHeight()甚至$('#dialog ul')[0].scrollHeight等于150.

您需要检查溢出元素的scrollHeight，因此请使用$('#dialog')[0].scrollHeight

如何检索#div的实际高度（包括溢出的部分）

3 个答案: