2

テーブルを含む div があります。このテーブルは動的に更新され、ユーザーが Web サイトを使用するにつれてデータがいっぱいになります。この div を常に下にスクロールするように強制することはできますか? これにより、ユーザーは追加された一番下のテーブル行を常に見ることができます。ありがとうございました！

4

6 に答える 6

4

それは次のようなものになります

...onRowAdded = function() {
    $('#myTable').animate({scrollTop: $('#myTable').attr('scrollHeight')});
};

行が非常に頻繁に追加される場合は、最初に変数チェックをブロックする setTimeout を使用して、1 秒あたり 2 回以上頻繁に下にスクロールしないようにする必要があることに注意してください。この手法については、たとえばここで説明されています

アップデート

jQuery 1.6 以降では、.attr() の代わりに .prop() を使用することをお勧めします (この質問へのコメントを参照してください)。

onRowAdded = function() {
    $('#myTable').animate({scrollTop: $('#myTable').prop('scrollHeight')});
};
于 2012-06-05T15:10:42.533 に答える
2

それのようなものを試してください：

のようなアンカーを作成し、<a id='bottomDiv'></a>このような JavaScript を挿入しますdocument.getElementById('bottomOfDiv').scrollIntoView(true);

ここで例を作成しました http://jsfiddle.net/PTmpL/1/

于 2012-06-05T15:24:10.577 に答える
2

update 要素を position absolute および bottom:0 として設定します

デモhttp://jsfiddle.net/Mdzmx/

于 2012-06-05T15:13:56.510 に答える
0

これは簡単な解決策になると思います!!!

element.scrollTo(element.get(0).scrollHeight);
于 2013-07-02T19:44:59.817 に答える
0

このチュートリアルに従ってください

http://jqueryfordesigners.com/fixed-floating-elements/

ただし、bottomcss プロパティを使用して、一番下の要素をページに表示します

element{ bottom:0; }

于 2012-06-05T15:05:26.343 に答える
0

I'd recommend using the ScrollTo JQuery plugin. Just use

element.scrollTo('max', {axis: 'y'});

or

element.scrollTo('max', duration, {axis: 'y'});

This plugin has the added benifit of having a nice smooth scroll.

于 2012-06-05T15:13:08.757 に答える