时间戳

首页 > 解决方案 > Javascript 返回 false 和 event.target

javascript - Javascript 返回 false 和 event.target

问题描述

有人可以解释为什么点击button1没有被捕获吗？我知道return false事件click会停止传播，但它仍然应该捕获元素，document.addEventListener('click', function(e) {console.log(e.target);});因为我们试图通过e.target而不是其父元素直接捕获主元素。

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $("#button1").click(function(){
       return false;
    });
});
</script>
</head>
<body>

<button id="button1">Button1 (dont get captured)</button>
<button id="button2">Button2 (get captured)</button>

  <script>
    document.addEventListener('click', function(e) { 
     console.log(e.target);});
  </script>
</body>
</html>

我无法更改该 jQuery 代码$("#button1").click(function(){return false});，但仍然想在button1元素被点击时捕获它（使用 javascript），有什么解决方法吗？

我可以绑定另一个事件处理程序来真正button1喜欢这样document.getElementById("button1").addEventListener("click", function(e){console.log(e.target)});有很多我想要捕获的元素（具有不同的类和 id），为每个元素添加一个事件侦听器是不切实际的，我只显示了一个按钮例子。，我只想记录单击的任何元素。

我无法更改页面的 jQuery 代码或 HTML，我只想在 chrome 控制台中运行一些测试，为此我想捕获每个被点击的元素

谢谢

标签： javascript

解决方案

返回错误；阻止浏览器对 button1 链接执行默认操作。

的等效代码return false是：

$('.button1')
   .click(function (event) {
       event.preventDefault();
       event.stopPropagation();
});

如果您只想停止传播，请使用stopPropagation().

看看这个，阅读更多关于preventDefault()和stopPropagation()

推荐阅读