jQuery onclick은 부모 요소를 숨기기

Question

나는 <li> 태그를 <a> 태그에 숨기고 싶습니다. jQuery를 클릭하십시오. 즉

<ul> 
    <li> 
    <a href="'>Something</a> 
    </li> 
    <li> 
    <a href="'>Something</a> 
    </li> 
    <li> 
    <a href="'>Something</a> 
    </li> 
</ul> 

누군가가 링크를 클릭하면 (<a></a>) 부모 <li>이 숨겨됩니다.

Answer 1

.click으로 이벤트를 처리 한 다음 .parent 및 .hide 방법을 사용하십시오.

$("a").click(function(){ 
    $(this).parent().hide(); // this is the link element that was clicked 
}) 

코드는 상기 링크리스트 엘리먼트 (<li>)에 직접 포함되는 것으로 가정한다. 그런 경우가 아닌 경우이 같은 .parent 방법에 선택기를 전달할 수 있습니다

$(this).parent("li").hide(); 

이이 링크의 조상을 통과하고 <li> 인 하나를 반환 찾을 수 있습니다. 브라우저가 태그의 HREF로 이동 한 것 <a> 태그를 클릭하면 거짓

보통을 반환

. 클릭 처리기에서 return false;을 원하거나 false를 반환하는 href를 추가 할 수 있습니다. <a href="javascript:void(0)">Link</a>. 이 in this question에 대해 더 많은 토론이 있습니다. 당신은 아마 당신이 숨기려하지 않는 페이지의 다른 링크가

• :

  이 있기 때문에 코드의 변화를해야 할 수도 있습니다이

  을하는 방법에는 여러 가지가 있습니다 의 부모. 이것이 "a"대신 선택자로 "ul li a"를 사용하는 것이 타당한 이유입니다. 목록 내에있는 링크에만 일치합니다.

• false를 반환하는 대신 이벤트 객체의 .preventDefault()을 사용할 수 있습니다 브라우저가 주소를 변경하지 못하도록하십시오.
• 클릭 한 후에 링크가 숨겨 지므로 .one 메소드를 사용할 수도 있습니다. 링크를 클릭하면 이벤트 처리기가 제거됩니다. 나중에 링크를 다시 표시하려면이 작업을 수행하지 마십시오.
• 당신은 당신의 목록은 동적 인 경우 .on 대신 .click, 즉 당신이 어떤 답변자가 자동 ​​호출 기능이라고 무슨의 코드를 포장 한
• 에 링크를 추가하기 위해 자바 스크립트를 사용 할 수 있습니다. 모양은 다음과 같습니다 : (function() { /* code */})(jQuery);. 비록 당신이 나중에 코드를 구조 도움이됩니다 초보자를위한이 권하고 싶지 않다. 기본적으로 코드에서 원하지 않는 부작용을 피하고 .noConflict을 사용할 수 있습니다.

Answer 2

부모를 숨기고 li 하이퍼 링크를 클릭하는 기본 동작을 시도하십시오.

$(function() { 
    $("a").click(function(e) { 
     e.preventDefault(); 
     $(this).parent().hide(); 
    }); 
}); 

Answer 3

$('a').click(function(){ 
    $(this).parent('li').hide(); 
}); 

Answer 4

당신은 요소의 부모를 대상으로 .parent()을 사용할 수 있으며, .hide() 그것을 숨길 수 : http://api.jquery.com/event.preventDefault/ 참조하십시오. 이 함수의 사용법에 대한 자세한 내용은 jQuery 문서를 참조하십시오. 브라우저가 링크를 따르지 못하도록하려면 .preventDefault()을 사용해야합니다.

$(function() { 
    $('a').click(function(e) { 
     e.preventDefault(); 
     $(this).parent().hide(); 
    }); 
}); 

Answer 5

는 return false;

$('a').click(function(){ 
     $(this).parent().hide(); 
     return false; 
    });​ 

Live Demo 또한

Answer 6

(function() { 
    $("ul li a").click(function(e) { 
    e.preventDefault(); 
    $(this).parent().hide(); 
    }); 
})(jQuery); 

은 "하나"jQuery를 기능

(function() { 
    $("ul li a").one('click', function(e) { 
    e.preventDefault(); 
    $(this).parent().hide(); 
    }); 
})(jQuery); 

Answer 7

$("a").click(function(){ 
    $(this).parent().hide(); 
    return false; 
}); 

을하려고 사용하는 것을 잊지 마세요

작동 예제는 여기에서 찾을 수 있습니다. http://jsfiddle.net/shinyakoizumi/aQanZ/