我有一个div框(称为“通量”),里面包含可变数量的内容。此divbox的溢出设置为auto。
现在,我想做的是,当使用滚动到此DIV框的底部时,将更多内容加载到页面中,我知道如何执行此操作(加载内容),但是我不知道如何检测用户何时滚动到div标签的底部?如果我想在整个页面上这样做,我会选择.scrollTop并将其从.height中减去。
但是我似乎无法在这里这样做?
我尝试从磁通量中获取.scrollTop,然后将所有内容包装在一个称为inner的div中,但是如果我将磁通量的innerHeight返回564px(div的高度设置为500)和“ innner”的高度当div底部显示564时,它将返回1064和滚动顶部。
我能做什么?
您可以使用一些属性/方法:
$().scrollTop()//how much has been scrolled $().innerHeight()// inner height of the element DOMElement.scrollHeight//height of the content of the element
因此,您可以取前两个属性的总和,当它等于最后一个属性时,您已经到达末尾:
jQuery(function($) { $('#flux').on('scroll', function() { if($(this).scrollTop() + $(this).innerHeight() >= $(this)[0].scrollHeight) { alert('end reached'); } }) });
编辑:我已经按照以下方式将“绑定”更新为“开启”:
从jQuery 1.7开始,.on()方法是将事件处理程序附加到文档的首选方法。