一意のIDを持つリンクのクリックイベント

Question

ページにはリンクがあり、クリックすると要素が削除されます。これは私のコードです：

<a href="#" class="remove-existed-field" id="link0">Delete input</a> 
<a href="#" class="remove-existed-field" id="link1">Delete input</a> 

などです。ご覧のとおり、リンクはIDによって異なります。そのため、一意のIDを持つ数百のリンクが存在する可能性があります。私はそれらに最も近いli要素を削除する必要があります。私は、このような方法でそれを実行します。

var i = 0; 

$('#link0' + i).click(function (e) { 
    e.preventDefault(); 
    $(this).closest('li').remove(); 
    }) 

が、私は次のことができます。

$(document).ready(function() { 

$('#link0').click(function (e) { 
    e.preventDefault(); 
    $(this).closest('li').remove(); 
    }) 

}); 

それは私がこれを行うことにより、変数iに、idの数値部分を入れてみましたid="link0"

のために働きますどのように動作させるにはどうすればいいのですか？i（どこにコードi++を入れるべきですか？）どんな助けもappriciateだろう。ありがとう！

Answer 1

とあなたが代わりにIDのclassesを使用することができ、すべての要素を対象とします...

あなたはこのようにそれを行うことができます。

$(document).ready(function() { 
 

 
    $('.remove-existed-field').on('click', function(e) { 
 
    \t \t $(this).closest('li').remove(); 
 
    }) 
 

 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<li><a href="#" class="remove-existed-field" id="link0">Delete input</a></li> 
 
<li><a href="#" class="remove-existed-field" id="link1">Delete input</a></li>

希望すると便利です！

Answer 2

「開始」セレクタを使用できます。

$('[id^=link]').click(

それはid開始link

Answer 3

各リンクaを処理する場合は、代わりにclassで行うことができます。 本当に必要な場合は、クリックしたリンクのidも入手できます。

$(document).ready(function() { 
    $('a.remove-existed-field').click(function (e) { 
     e.preventDefault(); 
     // $(this).attr('id'); 
     $(this).closest('li').remove(); 
    }); 

});