jQuery - LI 클릭/숨기기 UL - LI를 클릭하십시오 : href, UL 표시 계속 그리고 빈 창에서 열기

Question

SO에있는 훌륭한 공헌자 덕분에! jQuery는 이해하기 시작하면 훨씬 더 시원합니다. :)

그래서 클릭 할 때 아이 UL을 표시하거나 숨 깁니다. 내가 뭘하고 싶은건 빈 창을 여는 LI 내부의 링크를 클릭 할 수 있지만 하위 UL을 닫지는 않습니다. 빈 창이 열리면는 UL 닫히지 않습니다 있도록 LI에서 : 빈 창 개방 나는 "false를 돌려"하는 방법을 확실하지 않다, 그러나

a[href^="http://"]').attr("target", "_blank"); 

을 수행합니다. 사용자가 빈 창을 닫을 때 자녀 UL을 볼 수있게하고 싶습니다.

분명하지 않은 경우 알려 주시기 바랍니다.

감사합니다.

Answer 1

나는 당신을 위해 무엇을 찾고있는 것은 아마 event.stopPropagation()

가 여기에 문서의 생각 <li>에 포함되어 있기 때문에 click 이벤트도 트리거됩니다. 이 과정을 자식에서 부모로 진행하는 것을 이벤트 버블 링이라고합니다. event.stopPropagation()을 사용하여 중지 할 수 있습니다.

의 당신은 HTML 구조과 같이 가정 해 보자 또한

<ul> 
    <li class="reveal">One<br /> 
     <a href="http://www.google.com" target="_blank">Google</a> 
      <ul> 
       <li>a</li> 
       <li>b</li> 
       <li>c</li> 
     </ul> 
    </li> 
    <li class="reveal">Two<br /> 
     <a href="http://www.google.com" target="_blank">Google</a> 
      <ul> 
       <li>a</li> 
       <li>b</li> 
       <li>c</li> 
     </ul> 
    </li> 
    <li class="reveal">Three<br /> 
     <a href="http://www.google.com" target="_blank">Google</a> 
      <ul> 
       <li>a</li> 
       <li>b</li> 
       <li>c</li> 
     </ul> 
    </li> 
</ul> 

, 우리는 당신이 CSS 규칙이 있다고 말할 것이다 :

ul ul { display: none; } 

이 jQuery를 적용을, 당신은 얻을해야 당신이 찾고있는 결과 :

$(function() { 
    $('.reveal').click(function() { 
     $(this).children('ul').slideToggle(); 
    }); 

    $('.reveal a').click(function(event) { 
     event.stopPropagation(); 
    }); 
}); 

여기에 행동이의 라이브 데모는 다음과 같습니다 http://jsfiddle.net/PaxTg/

Answer 2

event orders을보고 적절한시기에 이벤트 전파를 중단 할 수 있습니다. , http://api.jquery.com/event.stopPropagation/

는 기본적으로, 어떤 일어나는 것은 당신이 <a>을 클릭하면, 클릭 이벤트가 트리거 될 것입니다 :