2

私の .js ファイルには、次を生成するボタン リスナーがあります。

$('#add').click(function(){
$('<div id="school-field'+i+'"><fieldset><a href="javascript:" id="remove'+i+'">Remove</a></fieldset></div>').fadeIn('slow').appendTo('.school');
});

追加されたボタンにリスナーを生成しようとしましたが、うまくいきません。「a」でデリゲートを使用しようとしましたが、divのIDを見つけるのは問題です。すべての生成に同じ div id (div id="school-field") を使用している場合、機能しますが、「remove'+i+'」がクリックされた要素ではなく、最後に追加された要素が削除されます。また、その中にリスナーを定義しようとしましたが、例外がスローされます。

$('#remove'+i'').click(function(){
var div = document.getElementById("school-field'+i+'");
div.parentNode.removeChild(div);
});

どうすれば適切に動作させることができますか?

4

4 に答える 4

3

jQuery 1.7 の時点では、とはどちらも非推奨でonあるため、使用する必要があります。livebind

$(document).on("click", ".delete", function(event){
    //Your code   
});

live新しい DOM 要素をイベント リスナーに自動的にバインドする ために使用できます: http://api.jquery.com/live/

bindまたは、追加ボタンのクリック イベント コールバック内 で手動で追加します。http://api.jquery.com/bind/

イベントリスナーのすべての要素に一致するクラスまたは別のセレクターを使用するだけです。

closestその後、親ボックスと一致させるために使用できます。

$(this).closest('div').remove();親div全体を削除するの と似ています。

于 2013-03-23T20:00:47.063 に答える
0

.on()このように使ってみてください

$("[id^='remove']").each(function() {
  var id = parseInt(this.id.replace("remove", ""));
  var elem = $("#remove" + id);

    $("#remove" + id).on('click',function(){
      var div = document.getElementById("#school-field"+id);
      div.parentNode.removeChild(div);
    });

});
于 2013-03-23T19:53:26.893 に答える
0

別の回答で述べたように、 jQuery のon methodを使用しますが、ハンドラーに送信される event.currentTarget パラメーターを使用します。

$('some container you keep your links').on('click', 'a[id*=remove]', function (event) {
    $el = $(event.currentTarget).parent();
    $el.remove();
});

ライブを使用して同様の機能を使用できますが、そのメソッドはjQuery 1.7の時点で廃止されてい ます。ここでは、jQueryでイベントをアタッチするさまざまな方法についての素晴らしい議論があります

于 2013-03-23T20:13:53.100 に答える
0

on メソッドのセレクターとして「a[id*=remove]」を使用するのはどうでしょうか。例えば：

$('first common container your a tags are stored').on('click', 'a[id*=remove]', function () {
    // your code to remove elements
});

これは、id 属性のパターンに一致する派手なセレクターを備えた on メソッドの委任された「バージョン」です

于 2013-03-23T19:59:51.197 に答える