고유 한 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(); 
    }); 

});