javascript - 创建一个按钮来运行 Javascript

Question

我正在尝试将一段代码附加到按钮的 OnClick 属性。

// Creating a Button
var btn = document.createElement("BUTTON");

// Append a text to the button

var t = document.createTextNode("random text");
btn.appendChild(t);

// attach the function to the eventLisenter 
btn.addEventListener('click', handleClick);

// function to be executed
var handleClick = function (event) {
    alert("DBZ");
}

按钮出现在它所属的位置，其中的文本也出现在它所属的位置，但是当我按下按钮时，函数内的代码不会执行，没有任何反应。我已尝试在 Firefox 和 Google Chrome 中运行代码。

我还尝试将“click”属性更改为“onclick”属性，在附加时添加/删除函数括号，还使用 ​​btn.attachNow 方法。真的什么都没发生。

非常感谢任何帮助，提前致谢。

Answer 1

您正在使用一个函数表达式来定义您的函数，并且您是在之后尝试分配您的事件处理程序。

因此，btn.addEventListener('click', handleClick); 与 btn.addEventListener('click', undefined); 相同

将函数定义移至您的代码中，使其首先发生。

更好的是，使用函数声明而不是函数表达式。

function handleClick (event) {
    alert("DBZ");
}

然后它将被提升并在调试器中查看时有一个有用的名称。