AddEventListener在onClick事件中不起作用

Question

我是一名中文翻译助手，以下是您所需内容的翻译结果。这段代码想要实现点击一个 div 后使用 windows.addEventListener 执行函数，但却没有任何反应。

以下是代码：

Javascript:

window.addEventListener('load', init);

function init(){
    document.addEventListener('DOMContentLoaded', function() {
        document.getElementById("wheelContainer").addEventListener("onclick", function() { winPrize;
        }, false);
    });
}

请问有人能告诉我我做错了什么吗？

谢谢。

- Lilu Patel

Answer 1

这里至少有三个问题：

1. 要用于 addEventLisener() 的事件名称是 "click"，而不是 "onclick"。
2. 你应该使用 window 的 load 事件或 DOMContentLoaded 事件中的一个，而不是两个都使用。
3. 你的点击处理函数实际上没有做任何事情。你是否想调用诸如 winPrize(); 的函数？

因此，修复所有这些问题后，您将得到以下结果：

document.addEventListener('DOMContentLoaded', function() {
    document.getElementById("wheelContainer").addEventListener("click", function() { winPrize();
    }, false);
});

因为可以在DOMContendLoaded事件触发时安装事件处理程序，所以根本不需要init()函数或窗口加载事件处理程序。

- jfriend00

---

"onclick" 用于为旧版 IE 的 attachEvent 添加事件。我想给这个答案点赞，但是已经达到了每日限制的次数 :( - undefined

那么，如果我移除窗口加载事件，只保留文档添加事件监听器，它应该可以工作吗？document.addEventListener('DOMContentLoaded', function() { document.getElementById("clickToPlay").addEventListener("click", function() { winPrize; }, false); }); - undefined

@NiraliPatel - 是的，那应该可以，因为我已经在我的答案末尾添加了。 - undefined

@jfriend00 - 我已经按照上述进行了代码编辑，但仍然无法正常工作。我在IE11和Firefox26.0中尝试过了。当我直接将函数添加到窗口事件（而不是绑定到任何元素）时，它可以正常工作。我不确定如何解决这个问题 :| - undefined

@NiraliPatel - 我注意到的另一件事是你的点击事件处理程序实际上没有做任何事情。你只是在事件处理程序中写了winPrize;，但这并没有起到任何作用。你是不是想要将其改为函数调用，像这样 winPrize();？ - undefined

@jfriend00 - 是的，谢谢！我确实是想把它变成一个函数调用！！现在它可以工作了。 - undefined