javascript - 要素を remove() して別の場所に append() すると、jQuery でイベントが失われますか?

Question

要素を remove() して別の場所に append() すると、jQuery ではどうなりますか?

イベントがフックされていないようです-まるで新しいhtmlを挿入したかのようです（これが起こっていると思います）。ただし、コードにバグがある可能性もあります。そのため、続行する前にこの動作を確認したかっただけです。

この場合、イベントを HTML のその部分だけに再接続する簡単な方法や、そもそもイベントを失うことなく要素を移動する別の方法はありますか。

Answer 1

jQuery detach（）関数はremove（）と同じですが、返すオブジェクトにイベントハンドラーを保持します。アイテムを削除して、すべてのものと一緒に別の場所に配置する必要がある場合は、これを使用できます。

var objectWithEvents = $('#old').detach();
$('#new').append(objectWithEvents);

ここでAPIドキュメントを確認してください：http：//api.jquery.com/detach/

Answer 2

はい、jQuery のアプローチremove()は、jQuery 自身にバインドされているすべてのものをバインド解除することですbind(メモリ リークを防ぐため)。

ただし、DOM 内で何かを移動するだけの場合は、最初に移動する必要はありませんremove()。心ゆくappendまで、イベントバインディングは残ります:)

たとえば、これをこのページの firebug に貼り付けます。

$('li.wmd-button:eq(2)').click(function(){ alert('still here!') }).appendTo(document.body)

次に、このページの一番下までスクロールして、SO フッターの下に埋め込まれている小さな地球のアイコンをクリックします。を取得しalertます。remove最初にそうしないように気をつけたからです。

Answer 3

jQuery1.3.1 live() を使用してイベントをバインドすると、これについて心配する必要はありません..

更新: ライブ イベントは非推奨になりましたが、$(document).on() から同じ効果を得ることができます。