Question

我有一个麻烦的功能，可能之前已经回答过但我做了一些搜索，大脑完全冻结了。所以我有这个代码：

function createTimeLink(){
    var link = document.createElement('a');
    link.id = "link_"+vooru_nr;
    link.textContent = "VOOR "+vooru_nr;
    link.onclick = timeHelper();
    var headrow = document.getElementsByClassName("elem_"+vooru_nr);
    headrow[0].textContent = "";
    headrow[0].appendChild(link);
}

function timeHelper(){
    console.log("clicked");
}

我创建了一个元素并尝试给它一个onclick属性。但是，如果我在window.onload中调用函数createTimeLink（），则会在控制台中记录“clicked”，但每次再次单击该链接时都不会记录。我怎么能这样做，如果我点击我的链接然后会发生什么？将来我想在点击一个链接后打开一个模态但是当前点击链接时它甚至不会在控制台中显示“点击”。

Answer 1

您正在将link.onclick设置为函数调用的 RESULT 。省略括号，它可能会起作用：

link.onclick = timeHelper;

在JavaScript中，函数是对象，所以你可以调用它们（你通常用函数做什么，这是括号做的），或者传递它们（在这种情况下，你不要写括号！）。

所以这两者非常不同：

someFunction();（运行函数，返回其结果）
someFunction;（不运行该功能）

@ w3re正确地指出，addEventListener可能是最干净的方法。它不会在此处更改功能，但您可能会在以后遇到一些示例，您希望有多个事件侦听器。

如果您尚未与addEventListener及其对应removeEventListener合作，我强烈推荐它！

Answer 2

您正在执行timeHelper（）并将该函数的结果分配给onclick处理程序。最重要的是，如果您使用的是JavaScript，那么添加事件的首选方法是addEventListener（）函数。

所以，改变

link.onclick = timeHelper();

到

link.addEventListener("click", timeHelper);

调用函数后不要自动点击链接

2 个答案: