0

クリックでdivを追加および削除しようとしています。追加には成功しましたが、削除部分がわかりません。

  • +質問: 要素は .remove() で DOM から完全に削除されますか?

HTML:

<center>
<a href='#' id='gogo'>Add</a>
<div id='sexy'></div>
</center>

jQuery:

var extra="<div class='bass'><a href='#' class='gaga'>Remove</a></div>";

$('#gogo').on('click', function(){


    $('#sexy').append(extra);



});

$('.gaga').on('click', function(){


    $(this).parent().remove();



});

JSFIDDLE: http://jsfiddle.net/Vmhe2/1/

4

5 に答える 5

2

これは役立つはずです

$('#gogo').on('click', function(){

    $('#sexy').append(extra);

    $('.gaga').on('click', function() {
         $(this).parent().remove();
    });

});

追加のdivを追加した直後にremove関数を移動しました

于 2012-09-13T20:50:00.350 に答える
1

イベントハンドラーを登録するときは、その時点でDOM要素が存在している必要があります。動的にバインドする場合は、delegate（）を使用します：http：//api.jquery.com/delegate/

于 2012-09-13T20:44:59.143 に答える
1

http://jsfiddle.net/Vmhe2/49/

これを試して ：）

于 2012-09-13T21:01:27.257 に答える
1

はい、要素は DOM から完全に削除されます。

于 2012-09-13T20:43:34.247 に答える
1

はい、.remove()要素を DOM ツリーから完全に削除します。

ただし、削除コードは次のようになります。

$('#sexy').on('click', '.gaga', function(e){ 
    e.preventDefault();  // as .gaga is anchor, so use preventDefault() 
                         // to stop default page load of browser
    $(this).parent().remove();
});

動的に追加している.gagaため、デリゲートイベント処理が必要であり、.on()メソッドを使用して実行できます。

作業サンプル

ノート

.on()デリゲート イベント(ライブ)の構文は次のとおりです。

$(StatciParent).on(eventName, target, handlerFunction);

ここで、動的ではない要素StaticParentの親を指し、イベントをバインドする必要がある要素です。targettarget

于 2012-09-13T20:43:52.897 に答える