如何检查正在单击哪个按钮

how to check which button is being clicked

本文关键字:单击 按钮 何检查 检查      更新时间:2023-09-26

我的问题有点奇怪,因为我有两个html buttons

<button>ok</button>
<button>ok</button>

和我附加onclick事件在他们像这样

var buttons=document.getElementsByTagName('button');
for(var i=0;i < buttons.length; i++){
  buttons[i].onclick = function() {  
      focus = this;
      alert("ok i am clicked")
  }
}

现在我在做

现在我有一个事件附加在window作为

window.onclick = function(e) {
    console.log(e.target == focus)
}

根据我这个console.log(e.target == focus)条件应该是true,如果我点击first按钮,但它也是truesecond按钮!

请告诉我我错在哪里,请给vanilla JavaScript解决方案,在我的情况下,我不能使用id,我将非常感谢你:)

从编辑开始,您的问题的解决方案非常简单:

在单击每个按钮时设置focus元素,然后窗口侦听器触发并检查目标(按钮)是否为focus元素。

显然,它将始终为真,因为您刚刚将其设置为focus元素。

您可以添加带有target.addEventListener(type, listener, useCapture);的窗口侦听器,并将useCapture设置为true
然后它会在按钮的onclick之前触发,你必须点击两次才能返回true。

您可以使用"立即调用的函数表达式"

这个模式将确保在点击i的时候仍然保持正确的值,因为它有自己的作用域:

var buttons = document.getElementsByTagName('button');
for (var i = 0; i < buttons.length; i++) {
    (function (i) {
        buttons[i].onclick = function () {
            alert("button " + i + " was clicked");
        }
    }(i));
}

参见小提琴