Question

我在这里找到了很多解决方案，如何防止子项在单击时运行指定的事件处理程序，但问题是它们仍然执行该处理程序直到函数返回。现在，我有一些输入字段，它们的本机点击处理程序不执行，它被覆盖。因此，输入文件字段不会打开文件浏览器，而是将指定的事件处理程序运行到父div。似乎即使谷歌不知道答案（或者我只是使用错误的关键词），你们知道任何解决方案吗？

以下是一些要测试的代码：http://jsfiddle.net/Mu58z/2/

<!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>

Answer 1

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

http://jsfiddle.net/Mu58z/2/

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

jQuery - 将click处理程序绑定到div（不）覆盖子代的处理程序

1 个答案: