2015-09-27 124 views
0

让我们假设我们有一个<div>和一些嵌套的元素:停止事件的子元素射击(无需访问事件处理程序)

<div id="outer"> 
    <!-- some code goes here ---> 
    <div id="inner"> 
    <!-- some code goes here ---> 
    </div> 
</div> 

一些听众(姑且称之为onOuterClicked)被绑定到#outer和被捕获由#inner,这不是我想要的。问题的关键就在于:

  • 我不能改变onOuterClicked(我只是没有打开)

  • 我想#inner通过点击呼叫onInnerClicked

  • 我不想#inner通过点击通话onOuterClicked

  • #inner可以添加或删除以后

所以,如果我只是onInnerClicked监听绑定到#inner的jQuery .on,它会调用反正onOuterClicked。我怎样才能避免它?

对不起,如果这是一个重复的问题,但我在这里找到的所有答案都是关于改变onOuterClicked的身体,这是我不能做的事情。

+0

包住呼叫到外事件侦听器,'outer.addEventListener( “点击”,功能(EVT){evt.stopPropagation(); onOuterClicked(EVT)},假);' – Saar

+0

需要被地狱在这种情况下“不能”的原因。阅读我的答案[这里](http://stackoverflow.com/questions/32544958/event-handlers-and-listeners-event-bubbling-and-event-capturing/)以更好地理解事件传播 - 并使用stopPropagation的示例()Rejith给出了下面的 – Ragdata

+1

可能的重复[如何防止父母的onclick事件在点击儿童锚时触发?](http://stackoverflow.com/questions/1369035/how-do- I-防止-A-岳父母的onclick事件 - 从 - 烧时,一胎化锚是-CLI) – Ragdata

回答

0
$(document).on('click', '#inner',function(event){ 
    if($(event.target).closest('#inner').length == 0){ 
     event.stopPropagation(); 
    } else { 
     onInnerClicked(); 
    } 
}); 
相关问题