停止子元素触发事件(没有访问事件处理程序)

Question

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

Answer 1

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