2

次のチェーンが機能します。

    $("</p>").html('message').hide().appendTo("#chat").fadeIn()
.parent().scrollTop($('#chat')[0].scrollHeight);

しかし、これはしません：

    $("</p>").html('message').hide().appendTo("#chat").fadeIn()
.parent().scrollTop($(this)[0].scrollHeight);

this.scrollHeightあまり機能しません。jqueryチェーンで現在のオブジェクト参照を取得するにはどうすればよいですか？

4

3 に答える 3

2

コールバック内の現在のオブジェクトにのみアクセスできます。チェーン内の現在のオブジェクトにアクセスする方法はありません。

これを試して：

var $parent = $("</p>").html('message').hide().appendTo("#chat").fadeIn().parent();
$parent.scrollTop($parent[0].scrollHeight);

チェーンから抜け出したくない場合は、次を再選択できます。

$("</p>").html('message').hide().appendTo("#chat").fadeIn()
.parent().scrollTop($("#chat")[0].scrollHeight);

しかし、私はそれに反対することを強くお勧めします。同じDOM要素を2回選択する必要はありません。

于 2012-01-09T21:19:58.273 に答える
1

2番目のコードスニペットでthisは#chat、それが機能しない理由を示していません。thisほとんどの場合、呼び出し元の関数インスタンスまたはイベントをトリガーしたオブジェクトを指します。

あなたはこのようなことを試すことができます

var $p = $("</p>").html('message').hide().appendTo("#chat");

$p.fadeIn().parent().scrollTop($p[0].scrollHeight);
于 2012-01-09T21:21:19.957 に答える
1

まあ、それは明らかです。#chat要素は静的要素であり、動的に段落を追加しています。したがって、事前にその要素への参照を取得する必要があります（たとえば、ページの初期化時）。

var chat = $( '#chat' )[0];

今、あなたはこれを行います：

$( '<p />' ).html( 'message' ).hide().appendTo( chat ).fadeIn();
$( chat ).scrollTop( chat.scrollHeight );

したがって、アイデアは、ページの初期化時に主要な静的要素（チャットボックス、ツールバー、パネル、ナビゲーションなど）への参照を取得し、それらの参照をアプリケーションコード全体で使用することです。

于 2012-01-09T21:42:59.843 に答える