0

何かがおかしいに違いない。何がわからないの?jsfiddleでこれを参照してください

/*
$("p").live("click", function(){
  $(this).after("<p>Another paragraph!</p>");
});
*/


$("p").on("click", function(){
  $(this).after("<p>Now Click Me...Another paragraph!</p>");
});

jquery1.7.2を選択しました。live正常に動作していますが、クリックonイベントは添付されません。jqueryのドキュメントによると、非推奨となったとおりにon機能するはずです。live何か案が?

4

5 に答える 5

5

イベントを正しくバインドしていません。on親にバインドする必要があります

$("body").on("click", "p", function(){ });

jsFiddle: http: //jsfiddle.net/h75BD/2/

構文を使用してバインドすると$('selector').on()、とまったく同じように機能し.click()、イベントは委任されません。$('parent').on('click', 'selector')委任(別名ライブ)する場合は、構文を使用する必要があります。

于 2012-07-03T04:59:11.347 に答える
3

あなたの例では、.on()うまく機能します。

しかし、覚えておいてください、$(some_selector).live('click', function(){})等しくはありません$(some_selector).on('click', function(){})

$(document).on('click', some_selector, function(){});
于 2012-07-03T04:59:42.180 に答える
2

動的に作成された要素を委任する必要があります。したがって、このようなものを使用する必要があります。 bodyの任意の親要素に置き換えることができますp

$('body').on('click','p',function(){
     $(this).after("<p>Now Click Me...Another paragraph!</p>");
});

http://jsfiddle.net/h75BD/1/

このようにして、イベントは親要素をバブルアップしbody、domの準備ができたときに存在するため、そこで処理されます。pあなたがそれをしていた方法では、それはdomの準備ができたときにそこにあった要素にのみアタッチされます。

于 2012-07-03T04:58:58.730 に答える
2

「オン」はそのようには機能しません。子要素が動的にアタッチされる親要素で「on」を呼び出します。この場合、それは体になります。

$('body').on('click', 'p', function(){});
于 2012-07-03T04:59:18.290 に答える
2

On は、選択されている要素の子孫にイベントをアタッチします。子孫を持たないpにアタッチており、新しく追加された段落 pは、ハンドラーに追加した p タグの後に挿入されるため、その下には入りません (新しく追加されたpは、あなたがクリックしたpの子孫ではありませんオン

つまり、既存のpを div に配置すると、新しく追加されたpは親 div の子孫になり、id div1 を持つ div の子孫である新しく追加されたすべてのpにアタッチされます。

2 番目の引数であるセレクターは、イベントをトリガーする選択された要素の子孫をフィルター処理することです。セレクターが null または省略されている場合、イベントは選択された要素参照に到達したときに常にトリガーされます。

ライブデモ

$("#div1").on("click", "p", function(){
  $(this).after("<p>Now Click Me...Another paragraph!</p>");
});

または、ドキュメントに配置して、ドキュメントに追加されたすべての要素 p をクリックして添付することもできます。

$(document).on("click", "p", function(){
  $(this).after("<p>Now Click Me...Another paragraph!</p>");
});

</p>

</p>

于 2012-07-03T05:09:17.187 に答える