jquery의 상위 선택자

Question

"removerow"클래스의 앵커를 클릭하면 숨길 필요가있는 테이블 행이 있습니다.

<tr><td>Product Name</td><td><a class="removerow">Remove</a></td></tr> 

나는이 노력했지만, 그것은 작동하지 않습니다

$("a.removerow").click(function(){ 
$(tr > this).hide(); 

});

".removerow"하위 항목과 함께 전체 표 행을 선택하는 방법은 무엇입니까?

내가 뭘 잘못하고 있니?

감사합니다.

Answer 1

jQuery의 closest(selector) 함수는 위쪽으로 이동하여 제공된 가장 가까운 선택자를 반환합니다.

는 (클릭 요소가 지정된 셀렉터과 동일 한 경우 해당를 반환합니다.)

http://api.jquery.com/closest/

$("a.removerow").click(function(e){ 
    $(this).closest('tr').hide(); 
    e.preventDefault(); 
}); 

e.preventDefault()

는 a 요소의 기본 동작을 사용할 수 없게됩니다.

Answer 2

jQuery에는 부모 선택자가 없지만 parent function이 있습니다.

또한 tr은 링크의 직접적인 상위가 아닙니다. 대신, 두 개의 레벨 업 (td이 첫 번째 부모) 다른 tr의 계층 구조에서이없는 경우 그럴 필요가에 클래스가있는 경우

$("a.removerow").click(function(){ 
    // Called twice (first is td, second is tr) 
    $(this).parent().parent().hide(); 
}); 

, 당신은 또한

$("a.removerow").click(function(){ 
    // Called twice (first is td, second is tr) 
    $(this).parents('tr').hide(); 
}); 

를 사용할 수있어 할 수 있습니다.

$("a.removerow").click(function(){ 
    // Called twice (first is td, second is tr) 
    $(this).parents('.ClassNameHere').hide(); 
});