動的divが自動的にスクロールしない

Question

これは前の質問How to fix a div heightの拡張です。

私はサイズを修正するのを手伝ってくれてありがとう。

しかし、この後私は最後の問題に出会った。すなわちスクロールする。

ユーザがメッセージを入力してエンターを押すと、2つの新しいdivが追加されます。 1つはユーザーデータで、もう1つは応答データです。

データは正しく生成されますが、チャットウィンドウで最後のdivを表示する代わりに、前のdivが表示されます。予想される出力

電流出力

は、私はいくつかのSOのフォーラムを訪問し、それらのどれもトリックもしませんでした。

どうすればいいのか教えてください。 [your_element].scrollTop = [your_element].scrollHeight

あなたがこの質問を確認することができます詳細については：あなたは自分の状況にこのコードを適応させることができ

おかげ

Answer 1

たびに新しいdiv要素は、あなたは、チャットウィンドウに追加されますJavaScriptまたはjQueryを使用してdivをスクロールする必要があります。 jQueryのを使用するための

：：のような

何か平野JavaScriptが

$('#chatHistory').scrollTop($('#chatHistory').scrollHeight);

：

elmnt = document.getElementById("chatHistory");
elmnt.scrollTop = elmnt.scrollHeight;

これはのようになります。 Use jQuery to scroll to the bottom of a div with lots of text

Answer 2

Scroll Automatically to the Bottom of the Page