用户手动滚动时如何防止自动滚动？ [复制]答案

【问题标题】：How can I prevent auto scroll when the user is manually scrolling? [duplicate]用户手动滚动时如何防止自动滚动？ [复制]
【发布时间】：2014-06-07 13:13:07
【问题描述】：

我有一个聊天应用程序，其中聊天消息显示在一个 div 中（id：messages_container）

每隔 5 秒，AJAX 请求-响应将新消息附加到 messages_container。当新消息到达时，我使用代码自动滚动到 div 的底部。

这是我使用的代码：

$("#messages_container").prop({ scrollTop: $("#messages_container").prop("scrollHeight") });

如果用户想查看更早的消息，他会向上滚动 div。问题是，当他手动滚动时，自动滚动会起作用，然后将用户带到 div 的底部。

当用户手动滚动时，如何防止自动滚动？我们有任何滚动事件吗？

请帮帮我。

【问题讨论】：

标签： javascript jquery html scroll

【解决方案1】：

您可以检查用户滚动如下，然后使用滚动禁用功能，如

//detect user scrolling or browser scrolling start  
var userScroll = false;     

function mouseEvent(e) { 
userScroll = true; 
} 

if(window.addEventListener) {
    document.addEventListener('DOMMouseScroll', mouseEvent,false); 
}


// detect browser/user scroll
$(document).scroll( function(){  
    console.log('Scroll initiated by ' + (userScroll == true ? "user" : "browser"));
});
    //detect user scrolling or browser scrolling end

//this is for scroll disableing
window.onmousewheel = document.onmousewheel = function(e) {
   e = e || window.event;
   if (e.preventDefault)
   e.preventDefault();
   e.returnValue = false;
 };

滚动禁用参考http://ajax911.com/disable-window-scroll-jquery/

【讨论】：