Javascript滾動底部

Question

我已經構建了一個人們可以聊天的小聊天室。 它可以與AJAX一起使用，它可以記錄並放置它們。

除了一個小問題，一切正常。 每次調用AJAX時，我都希望它將div向下滾動到底部。 （最新的聊天消息是在底部）

但是，我無法弄清楚如何跟蹤用戶是否已經在聊天室內自己滾動或不。

我想防止用戶在聊天中處於活動狀態時的「自動向下滾動」。

我該如何解決這個問題？

HTML聊天的：

<div id="chat"> 
    <div id="chatoutput></div> 
</div> 

的Javascript，使得它滾動到頁面底部：

jQuery("#chat").scrollTop($("#chat")[0].scrollHeight); 

Answer 1

您可以禁用自動向下滾動，如果用戶一旦手動滾動：

$("#chat").scroll(function() { 
    autoScrollEnabled = false; 
}); 

儘管在向下滾動之前您必須檢查autoScrollEnabled。

if (autoScrollEnabled) { 
    jQuery("#chat").scrollTop($("#chat")[0].scrollHeight); 
} 

您還可以存儲DateTime值，以檢查用戶上次滾動的時間，並在1分鐘前啓用autoScroll。

Answer 2

只需使用簡單的javascript方法。

$(document).ready(function() { 
    var objDiv = document.getElementById("chat"); 
    objDiv.scrollTop = objDiv.scrollHeight; 
});