Javascript jQuery-将单击处理程序绑定到div（不覆盖子项）'；s处理程序_Javascript_Jquery_Event Handling

Javascript jQuery-将单击处理程序绑定到div（不覆盖子项）'；s处理程序

javascript jquery

Javascript jQuery-将单击处理程序绑定到div（不覆盖子项）'；s处理程序,javascript,jquery,event-handling,Javascript,Jquery,Event Handling,我在这里找到了许多解决方案，可以防止子级在单击时运行指定的事件处理程序，但这里的问题是，在函数返回之前，它们仍然执行该处理程序。现在，我有一些输入字段，它们的本地点击处理程序不执行，被覆盖。因此，输入文件字段不会打开文件浏览器，而是运行分配给父div的事件处理程序。似乎连google都不知道答案（或者我只是使用了错误的关键字），你们知道解决方案吗下面是一些要测试的代码： var计数=0； var myEventHandler=函数（e）{ e、停止传播（）； e、预防默认值（）；警报（

我在这里找到了许多解决方案，可以防止子级在单击时运行指定的事件处理程序，但这里的问题是，在函数返回之前，它们仍然执行该处理程序。现在，我有一些输入字段，它们的本地点击处理程序不执行，被覆盖。因此，输入文件字段不会打开文件浏览器，而是运行分配给父div的事件处理程序。似乎连google都不知道答案（或者我只是使用了错误的关键字），你们知道解决方案吗

下面是一些要测试的代码：


var计数=0；
var myEventHandler=函数（e）{
e、 停止传播（）；
e、 预防默认值（）；
警报（++count+“触发次数”）；
}
//该变量已设置，我找不到元素
var foo=$（“#myContainer”）；
//试试这些，它们都没有达到预期效果
//foo.on（'click'，myEventHandler）；
foo.filter（':not（input:file）'）。在（'click'，myEventHandler）上；

已解决。当我单击输入按钮时，由于传播的原因，它还触发了父级的事件处理程序，解决方案非常简单。我从未覆盖过输入的事件处理程序

你能分享相关的代码吗？这会使锻炼变得容易得多。

<!DOCTYPE html><html><head></head><body>
  <div id="myContainer">
    <input type="file" />
    <input type="file" />
  </div>
<script type="text/javascript">
var count = 0;
var myEventHandler = function(e) {
e.stopPropagation();
e.preventDefault();
alert(++count + ' times fired');
}

// that variable is already set and I cannot find the element
var foo = $('#myContainer');

// try these, none of them works as intended
//foo.on('click', myEventHandler);
foo.filter(':not(input:file)').on('click', myEventHandler);
</script>
</body>
</html>

$('input:file').on('click', function () { 
  e.stopPropagation();
}