0

ユーザーがさらに情報を追加する必要がある場合は、appendメソッドを使用して、いくつかの入力フィールドとフォームにボタンを追加しています。各ボタンの名前とIDは異なりますが、クラスは同じです。

追加プロセスは正常に機能していますが、新しいボタンを使用して特定のフィールドを削除したい場合は機能しません。クリックアクションは、デフォルトで存在する最初のボタンに対して機能しますが、実行時に追加されたボタンに対して機能するようになりました。

   rc; //is the counter which increments by one, each time.
   jQuery('#mytable').append("<div id='rev-" + rc + "' class='reviewer'>" +
                             "<input type='text' name='reviewer_email[]' id='reviewer_email" + rc + "' value=''  />" +
   "<input type='button' name='rd" + rc + "' id='rd" + rc + "' class='rrd' value='Remove' /></div>");

   jQuery(".rrd").click(function(){
    alert("Test");
   });

私は解決策を探しました。最初はすべてのボタンに同じIDを使用していましたが、現在はidの代わりに各ボタンに同じクラスを使用しています。

誰かが私が間違っているところのアイデアを与えることができますか？

上記のコードは正確なコードではありませんが、私がそれをどのように使用しているかを考えています。

ありがとう。

4

3 に答える 3

2

.click()イベントハンドラーは、DOMに既に追加されている要素に対してのみ使用できます。

動的に追加される要素の場合は、次を使用する必要があります.on()。

$(document).on("click", ".rrd", function(event){
    // do stuff
});

または、jQuery <1.7を使用する場合は、次を使用する必要があります.delegate()。

$(document).delegate(".rrd", "click", function(event){
    // do stuff
});

.live()これは非推奨であり、速度も遅いことに注意してください。

jQueryドキュメントから：

jQuery 1.7以降、.live（）メソッドは非推奨になりました。.on（）を使用して、イベントハンドラーをアタッチします。古いバージョンのjQueryのユーザーは、.live（）ではなく.delegate（）を使用する必要があります。

于 2012-05-16T13:55:46.403 に答える
0

クラス.rrdを使用してすべての要素にイベントをバインドしましたが、これは動的に作成された要素にはカウントされません（ページがロードされた後）。

代わりに、最初にhead要素をターゲットにしてから、削除する実際の要素をターゲットにします。

このビデオをチェックしてください、それは詳細に説明されています-> http://tutsplus.com/lesson/bind-live-delegate-huh/

于 2012-05-16T13:57:25.543 に答える
0

これは問題の直接的な解決策ではありませんが、一般的にはより良い解決策になる可能性があります。すべてを自分で開発する代わりに、既存のプラグインを使用することを検討しましたか？

SheepItを見てください他にもあるかもしれませんが、私はこれだけを使用しました。

于 2012-05-16T13:59:59.057 に答える