javascript - 使用 jQuery 的 debounce 判断用户是否停止滚动

标签 javascript jquery

我正在编写一个网页,用于跟踪用户在垂直滚动网页上的位置。我目前正在收听 scroll 事件,但它触发得太频繁了。我想做的是听一些类似 scroll end 事件的东西,但那不存在。我已经阅读了关于 StackOverflow 的一些答案,包括使用超时,我想我已经决定使用 jQuery 的 debounce 方法来做这样的事情:

$(window).scroll($.debounce( 250, true, function(){
    $('#scrollMsg').html('SCROLLING!');
} ) );
$(window).scroll($.debounce( 250, function(){
    $('#scrollMsg').html('DONE!');
} ) );

我担心我仍然会错过一些 scroll end 事件。 总是捕获 end 事件对我的服务很重要,这样我就可以准确跟踪用户在网页上的位置。任何人都可以阐明这是否是一个有效的问题?我做了一些粗略的测试,但我没有足够的信心调用电话......

最佳答案

我认为用户正在查看您网页的“哪一部分”与数据库中存储的信息或您将该信息存储在何处之间总是会有延迟, 而且您也不能在他滚动或移动鼠标时发送获取请求,因为这会导致大量请求。

所以在我看来,您只需设置一个适合您要求的时间间隔,就可以向您的服务器发送一次“心跳”,比方说每 5 秒一次,这实际上是一个 json数据包括他正在浏览的当前链接以及页面的哪一部分以及您可能会发现有用的任何其他数据,例如上次事件(您可以通过多种方式衡量这一点:例如上次鼠标悬停在 <body> 上的移动) 这样您将来就有机会向 heart beat 添加任何信息。传送到您的服务器并为您提供更多跟踪信息。

关于javascript - 使用 jQuery 的 debounce 判断用户是否停止滚动,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31225859/

相关文章:

jquery - 在 jquery 中 <span> 之前添加 <li> 和 </li> 之间

javascript - 一个很好的拖放解决方案

javascript - 提交后文本消失 jQuery

javascript - jQuery 将焦点设置在元素之外

javascript - 是否可以使用 <<method>> 调用 JavaScript 方法 : <<method_param>>?

javascript - 在 JQuery 中,为什么 $(this) == $(this) 返回 false?

javascript - 为什么wordpress要把jquery放在前面?

jQuery 显示/隐藏规则

javascript - 替换javascript问题中字符串中的所有匹配项

javascript - 滚动到时如何加载iframe?