当用户手动滚动时，如何防止自动滚动？

Question

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

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

这是我使用的代码：

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

如果用户希望看到前面的消息，他向上滚动股利。问题是，当他手动滚动时，自动滚动工作，然后将用户带到div的底部。

如何防止用户手动滚动时自动滚动？ 我们有没有滚动事件？

请帮帮我。

Answer 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/