jquery - 有新消息时，聊天滚动不会下降？

Question

http://driptone.com/jony/applications/chat/index.php

当有新消息发生时，滚动只会向上滚动，而我有一个方法可以将其向下拖动，如果它位于底部：

                element = $("#chat")[0];
                if (element.scrollTop == element.scrollHeight - element.height) {
                    element.scrollTop(element.scrollHeight);                
                }               

运行此间隔时：

        setInterval(function() {
                pingServer();   
                element = $("#chat")[0];
                if (element.scrollTop == element.scrollHeight - element.height) {
                    element.scrollTop(element.scrollHeight);                
                }               
        }, 5000);   

它以前可以工作，我不知道为什么它现在停止工作。

知道为什么它停止了吗？

    function reload() {
            $.post("ajax.php", { loadMessages : "1" }, function(data) {
                    $(".discussion").html(data)
                    element = $("#chat")[0];
                    if (element.scrollTop == element.scrollHeight - element.height) {
                        element.scrollTop(element.scrollHeight);                
                    }                           
            });
    }

重载功能

Answer 1

Your ping to the server is working asynchronously, and you are not calling your logic to adjust the scroll position on call back of this request.

Therefore, unless your ping responds instantly, your process flow is:

• Ping server
• Adjust scroll
• Response received from ping
• New messages added

Whereas you require:

• Ping server
• Response received from ping
• New messages added
• Adjust scroll

Therefore you need to call your scroll adjust in your call back after where you add the new messages.

---

Any idea why did it stop?

My guess is your server response is now taking longer (perhaps you've moved in a production environment) and therefore your process flow is out of sync.

Answer 2

Try this, seems to work when I test in console:

var element = $("#chat")[0];
element.scrollTop = element.scrollHeight;

I don't think you need if condition, you never get inside it.