0

いくつかのdivが動的に作成されており、bind / live（両方を試しました。同じ結果）を使用してクリック関数を追加しています。ただし、同じクラスのすべてのdivを返しています。

例;

動的に生成された3つのdivがあります

1 2 3

2をクリックすると、アラートメソッドは1、2、3の順に表示されます。クリックする必要があるのは1つだけです。ありがとう！

$("#borang_main_form").append('<div class="borang-row" id="'+id+'"><label id="label_'+id+'"></label><input id="textbox_'+id+'" type="text" /></div>').bind("click", function(){alert(id);});

私はこれを試しましたが、うまくいきました。

$("#borang_main_form").append('<div class="borang-row" id="'+id+'"><label id="label_'+id+'"></label><input id="textbox_'+id+'" type="text" /></div>').delegate("#" + id, "click", function(){alert(id);});

しかし、それは少し汚れているように見えます。このようなものにアプローチするためのより良い方法はありますか？

4

2 に答える 2

1

ループを繰り返すときは、メソッドチェーンを使用します。これにより、基本的に、同じ親アイテム（ "#borang_main_form"）にn個のイベントバインディングが追加されます。

ループ内で最初にアイテムを追加し、次にループ外でイベントリスナーを個々の子要素に追加します。

for(var i=0; i<3; i++)
{
  var id = i;
  $("#borang_main_form").append('<div class="borang-row" id="'+id+'"><label id="label_'+id+'"></label><input id="textbox_'+id+'" type="text" /></div>')
}
$('.borang-row').on("click", function(){alert($(this).attr('id'));});

イベントハンドラー関数では、$（this）はクリックされたアイテム（イベントのトリガー）としてマップされ、それを介し$(this).attr('id')てその要素のid属性を取得します。

于 2012-12-04T09:57:42.447 に答える
1

$(e.target)クリックハンドラーで使用してfunction(e){ ... }、実際にクリックした要素を参照するjqueryオブジェクトを取得できます。

http://jsfiddle.net/fDZ4J/1/

于 2012-12-04T09:44:37.200 に答える