点击事件在文档加载 Tampermonkey 时触发

【问题标题】：Click event fires on document load Tampermonkey点击事件在文档加载 Tampermonkey 时触发
【发布时间】：2015-03-30 14:11:00
【问题描述】：

我正在编写一个 Tampermonkey 脚本，它向页面添加一个按钮，然后向该按钮添加一个 onClick 事件。我在我想要的页面上有按钮，但是当我尝试使用“addEventListener”附加点击事件时，如有关用户脚本中点击事件的相关问题中所建议的那样，事件处理程序会在页面加载时触发，而不是在按钮点击时触发.

var testbutton = document.createElement("button");
testbutton.addEventListener('click', alert("Working"), false);
testbutton.id = "testbutton";
testbutton.innerHTML = "This is a button";

testElement.appendChild(testbutton);

基本上，当页面加载“工作”警报时会触发，但当我单击按钮时不会触发。我也没有得到控制台反馈。我错过了什么？

【问题讨论】：

标签： javascript tampermonkey

【解决方案1】：

那是因为您在页面加载时调用警报，而不是在点击时，您可能还想要一个匿名函数

var testbutton = document.createElement("button");

testbutton.addEventListener('click', function() {
    alert("Working");
}, false);

testbutton.id = "testbutton";
testbutton.innerHTML = "This is a button";

testElement.appendChild(testbutton);

当你给函数添加括号时，它会立即被调用，在事件上调用函数，你只是想引用它，这里有一些例子

addEventListener('click', alert("Working"), false); // called immediately

addEventListener('click', alert, false);            // called on click

addEventListener('click', function() {}, false);    // called on click

addEventListener('click', function() {
   alert();
}, false);    // called on click

【讨论】：

太棒了，谢谢。我对通过直接 JS 创建元素而不是将它们写入 HTML 文档有点陌生。