javascript - addEventListner 在 HTMLElement 被点击之前被触发

Question

我在 onLoad 调用的函数内的 HTMLElement 上使用 addEventListner 方法。但是，即使在我尝试 html 页面中的单击事件之前，该方法也会被执行。

        function setConfigurationMenu(){

            var navConfigure = document.querySelector(".navConfigure");
            var navBody = navConfigure.querySelector(".body");
            var navTop = navConfigure.querySelector(".top");

            navTop.addEventListener("click", alert("jow"));

        }

那么这里发生了什么，有什么想法吗？

谢谢，

Answer 1

发生这种情况是因为您传递了 functionresult而不是 function handler，为此尝试使用匿名函数：

navTop.addEventListener("click", function() {
    alert("jow");
});

换句话说，在您的情况下，您只需调用函数，但您需要为此传递处理程序。

Answer 2

发生这种情况是因为您正在执行该alert函数并将其返回值（即undefined）作为参数传递给该addEventListener方法。您实际上需要将一个函数传递给它。

navTop.addEventListener("click", functionToBeTriggered);

正如您所alert期望的文本参数一样，您可能希望将其包装到调用它的匿名函数中。例如：

navTop.addEventListener("click", function() {
    alert("jow")
});