JQueryのチャットアプリケーションは、新しいメッセージでのみdivの一番下までスクロールしますか？

Question

私は複数のチュートリアルからこのAJAXコードを取り上げましたが、問題は、ajaxが呼び出されるとdivが常に下にスクロールすることです。しかし、divに新しいメッセージがある場合にのみdivがスクロールするようにしたい。

$.ajax({ 
    url: "msg-handle/get-messages.php", 
    cache: false, 
    data: { room: $("#room").val() }, 
    success: function(data) { $('#chat').html(data) 

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

    }, 
}); 

}, 500); 

せずに自分のコードにすべての主要な悪影響をこのを達成する方法はありますか？

Answer 1

divに新しいメッセージがあるときに、PHPスクリプトにフラグを渡すのが最も簡単な方法です。スクロールのためのチェック条件を入れるだけです。

別のオプションは、新しい.get（）結果のdivの数を前のものと比較し、現在のdivがさらにある場合にのみスクロールすることです。

Answer 2

var oldscrollHeight = $("#chat")[0].scrollHeight; 
         //Takes the height BEFORE reload the div 

$.ajax({ 
    url: "msg-handle/get-messages.php", 
    cache: false, 
    data: { room: $("#room").val() }, 
    success: function(data) { $('#chat').html(data) 

    var newscrollHeight = $("#chat")[0].scrollHeight; 
          //Takes the height AFTER reload the div 

    if(newscrollHeight > oldscrollHeight){ //COMPARES 
     $("#chat").scrollTop($("#chat")[0].scrollHeight); //Scrolls 
    } 
}, 
}); 

（他のソリューションの中で）...私はそれを試していないが、私はそれがこのようなものであることを持っていると思う私は、あなたが最初のロード後$("#chat").scrollTop($("#chat")[0].scrollHeight);を入れて持っていると思いますチャット..ちょうど助言。