自定義聊天框滾動條總是顯示底部

Question

我有一個自定義聊天框。我加了overflow-y來滾動。 現在每當我在文本框中寫入內容時，它都會出現在滾動條窗口中。 如何讓滾動條窗口顯示我寫的最後一條消息，在我的情況下，它總是顯示頂部。

Answer 1

在Javascript中，你可以嘗試一下，假設你的DIV的ID爲"scrolling"

的document.getElementById（ 「滾動」）scrollTop的=的document.getElementById（ 「滾動」）scrollHeight屬性。;

其中scrollTop是對象滾動的像素數，scrollHeigth是元素內容的總高度，包括由於溢出而不可見的內容。

重要：

上面的代碼應每出現在客艙新的消息的時候，這樣做就應該設在正確的地方爲你的腳本執行。

來源：

https://developer.mozilla.org/en-US/docs/DOM/element.scrollTop

https://developer.mozilla.org/en-US/docs/DOM/element.scrollHeight

另一種解決方案：

也許你還可以通過，具有錨（#idOfLastMessage）的消息，然後使用iframe做到這一點，而不是一個div，它指向www.yoursite.com/url-of-the-message-list#idOfLastMessage