首页 > web前端 > js教程 > 如何使用 jQuery 检测用户何时到达具有可变内容的 Div 底部?

如何使用 jQuery 检测用户何时到达具有可变内容的 Div 底部?

Linda Hamilton
发布: 2024-10-30 20:00:03
原创
424 人浏览过

How to Detect When a User Has Reached the Bottom of a Div with Variable Content Using jQuery?

使用 jQuery 检测 Div 滚动结束

目标:
确定用户何时滚动到底部指定 div 元素的。

问题:
如何检测用户何时到达内容数量可变且溢出设置为自动的 div 底部?

答案:

要检测 div 滚动的结束,请使用以下 jQuery 属性/方法:

  • $()。 scrollTop():返回元素水平或垂直滚动​​的量。
  • $().innerHeight():返回元素的内部高度。
  • DOMElement.scrollHeight:返回元素内容的高度。

结合前两个属性得到总的可见高度,并与scrollHeight比较来确定当用户滚动到底部时。

<code class="javascript">jQuery(function($) {
    $('#flux').on('scroll', function() {
        if($(this).scrollTop() + $(this).innerHeight() >= $(this)[0].scrollHeight) {
            alert('End of div reached');
        }
    })
});</code>
登录后复制

附加说明:

  • 提供的代码使用 jQuery 1.7 语法。对于旧版本,请使用 .bind() 而不是 .on()。
  • 即使动态添加或删除 div 内的内容,此解决方案也能正常工作。
  • 调整事件处理程序到您喜欢的容器和操作。

以上是如何使用 jQuery 检测用户何时到达具有可变内容的 Div 底部?的详细内容。更多信息请关注PHP中文网其他相关文章!

来源:php.cn
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
作者最新文章
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板