0

そのため、現在 .append() を使用して Web ページのすべての投稿に機能を追加していますが、追加の投稿がページに読み込まれると、追加された機能は新しいコンテンツに含まれません — 私はしようとしていますすべての新しいコンテンツにも追加機能があることを確認する方法を考え出してください。

$(this).append('<div id="new_feature></div>');

このようなもの？

$(this).live().append('<div id="new_feature></div>');

おそらく、ループで常に追加する方法がありますか？

4

6 に答える 6

3

DOMNodeInserted イベントがあります:

$('button').click(function() {
  $('#appendme').append($('<div class="inner">').text(Math.random()));

})

$('#appendme').on('DOMNodeInserted','.inner',function() {
 console.log(this); 
});

デモ

更新: これは IE では機能しないようです。propertychnageイベント ハンドラーも試してください ( $('#appendme').on('DOMNodeInserted,propertychange') が、確認できる IE がありません。

update2: Domnode* は mdn によると非推奨のようです。代わりにMutationObserverオブジェクトを使用するように指示されています

update3: ここでは、MutationEvents のクロスブラウザー ソリューションはあまりないようです。この回答setTimeOutを参照してください。イベントがサポートされていて、フォールバックまたは livequery オプションがある場合は、上記のコードを使用することをお勧めします。

update4: のみに依存している場合は、次のように.append()パッチを適用できます。jQuery.fn.append()

jQuery.fn.append=function() {
                return this.domManip(arguments, true, function( elem ) {
                        if ( this.nodeType === 1 || this.nodeType === 11 ) {
                                this.appendChild( elem );                             
                                $(elem).trigger('appended');
                        }
                });
        };

$('button').click(function() {
  $('#appendme').append($('<div class="inner">').text(Math.random()));

})

$('#appendme').on('appended','.inner',function() {
 console.log(this); 
});

デモ2

ここjQuery.fn.domManipのように偽装する方が正しいかもしれません

于 2013-01-12T03:27:42.997 に答える
2

jQueryドキュメンテーション：

.live() メソッドの使用は推奨されなくなりました。jQuery の新しいバージョンでは、欠点のないより優れたメソッドが提供されているためです。

n ミリ秒ごとsetTimeout()に新しい s をチェックできる関数を使用できます。<div>

$(function(){
    setInterval("Check4NewDivs();",1000);
});

つまり、thisは の div でありclass="comment newdiv"、ページに初めて表示されるときに、newdiv動的に作成されたことを関数に知らせるクラスがあります。

function Check4NewDivs(){
    $(".comment .newdiv").each(function(){
        $(this).append('<div class="new_feature"></div>').removeClass("newdiv");
    });
}
于 2013-01-12T03:10:12.850 に答える
1

そうでappendはありませんappened。
live非推奨のイベント ハンドラです。このようには使用されません。代わりに使用onします。 http://api.jquery.com/live/

したがって、 をクリックすると次のコードが実行されますselector。

$(document).on('click', 'selector', function() {
    $(this).append('<div id="new_feature></div>');
});
于 2013-01-12T03:07:24.187 に答える
1

いいえ、そのようにする標準的な方法はありません。DOM要素が挿入されるたびに発生するイベントなどの提案がありましたが、それに頼ることはできません。

代わりに、次のいずれかに依存します。

  • (できれば) コールバック - 何かをプルするたびに (ただし、サーバーから正常にプルして DOM に挿入した後はすぐに)、そのような追加されたスニペットの存在を保証する関数を呼び出すだけです。
  • 一定のチェック - insetInterval()またはを使用するのと同様setTimeout()ですが、これは不要な処理であり、常に処理の重いチェックを実行しない限り、すぐに追加されることはありません。
于 2013-01-12T03:08:14.800 に答える
0

ページに既に存在する要素にバインドする必要があります。追加されたコンテンツをライブにする例を書きました。

JSFiddle のデモ

HTML

<div id="container">
  <div id="features">
  </div>
  <br />
  <a href='#' id='clickme'>click me to add feature</a>
</div>

JS

$(function() {
  $('#clickme').on('click', function(e) {
    $('#features').append('<div class="new_feature">new feature</div>');
  });

  $('#features').on('click', '.new_feature', function() {
    alert('i am live.');
  });
});
于 2016-08-14T21:00:45.543 に答える
0

オンロード機能を使用します。

$(item).on('load',function(){
    $(this).append('<div id="new_feature"></div>');
});

これにより、アイテムが読み込まれると、アイテムがコールバックとして追加されます。また、常に同じ ID のものを追加するのではなく、ある種の動的 ID 作成者を選択することもできますが、それは私だけです。

于 2013-01-12T03:08:15.527 に答える