停止事件的子元素射击（无需访问事件处理程序）

问题描述：

让我们假设我们有一个<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的身体，这是我不能做的事情。

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

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

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

答

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

停止事件的子元素射击（无需访问事件处理程序）

相关推荐