.onを使用して追加されたコンテンツのjQueryイベント？

ドキュメントにajaxを使用してコンテンツを追加しましたが、イベントは発生しません。私はこれが.live（）を使って行うことができることを知っていますが、私は今どこかでそれが廃止されていると読んでいますか？.onを使用して追加されたコンテンツのjQueryイベント？

これは私のコード（それは、新たに追加項目の準備ができて、ではなく、文書に正常に動作します）です：

$('li[id^="inv-"] a.close').on('click', function(){ 
var item=($(this).closest("li[id^='inv-']")).attr('id'); 
var id = parseInt(item.replace("inv-", "")); 
$.ajax({ 
    type: "POST", 
    url: "ajax-invi.php", 
    dataType: "html", 
    data: "id="+idboda+"&idinv="+id+"&borrar=ok", 
    success: function(data) { 
    noty({"text":"El invitado ha sido borrado"}); 
    $("body").find('li#inv-' + id).remove(); 
    } 
    }); 
});

やアイテム：

<ul> 
    <li id="inv-39"> 
    <div class="row_field"> 
    <label>Adri</label> 
    <a class="close" href="#invlist">Borrar</a> 
    </div>     
    </li> 
    <li id="inv-40"> 
    <div class="row_field"> 
    <label>Marga</label> 
    <a class="close" href="#invlist">Borrar</a> 
    </div> 
    </li> 
</ul>

出典

2012-03-26 Elaine Marley

'e.preventDefault（）;'がトリックです。http://stackoverflow.com/a/9869024/880434 –

は

$('ul').on('click','a.close', function(){ 
var item=($(this).closest("li[id^='inv-']")).attr('id'); 
var id = parseInt(item.replace("inv-", "")); 
$.ajax({ 
    type: "POST", 
    url: "ajax-invi.php", 
    dataType: "html", 
    data: "id="+idboda+"&idinv="+id+"&borrar=ok", 
    success: function(data) { 
    noty({"text":"El invitado ha sido borrado"}); 
    $("body").find('li#inv-' + id).remove(); 
    } 
    }); 
});

を試してみてください

このようにして、DOMがロードされてelemのイベントを処理する際に存在するulにイベント処理を委譲しますAJAXを通じて追加されたものです。 ULが存在しない場合は、DOMがロードされたとき、あなたが<body>タグ

EDITに委任することができ - （生きて）それは実際にon()のラッパーだ（それはdelegate()ラッパーだった前）が、代表はイベントが通常の取り扱いwindowこれは、イベントが非常にバブルアップしなければならないことを意味します。

live: function(types, data, fn) { 
    jQuery(this.context).on(types, this.selector, data, fn); 
    return this; 
},

出典

2012-03-26 08:44:22

はい、これが私の必要です。私は.live（）のように動作すると思ったのですが、これはなぜですか？ –

@ElaineMarley live（）はデリゲート（）の周りのラッパー（実際にはラッパーでon（））でした。何らかのバックグラウンドで自分の答えを編集していました –

この情報をお寄せいただきありがとうございます。 –

$(document).on('click', 'li[id^="inv-"] a.close', function(){ 
//... 
});

だから、jQueryのソースから取得した、あなたは、ページのロードに存在し、将来的に追加されるの兄弟を探し、いくつかの親要素にイベントを追加します。

出典

2012-03-26 08:47:52 Smileek

.onを使用して追加されたコンテンツのjQueryイベント？

答えて

関連する問題