Chrome 扩展：事件监听器答案

【问题标题】：Chrome Extension: event listenersChrome 扩展：事件监听器
【发布时间】：2013-11-30 07:37:18
【问题描述】：

我知道由于 chrome 的 csp，我无法执行内联 javascript。我有一个名为 popup.html 的 html 文件，其中包含此内容。

    <body>
        <a href="#" id="clickme">Button</a>
    </body>

还有一个名为 chrome.js 的外部 javascript 文件，其中包含以下代码：

document.addEventListener('DOMContentLoaded', init());

function init(){
    var elem = document.getElementById('clickme');
    elem.addEventListener('click',func());
}
function func(){
    alert('button clicked');
}

每当我重新加载 chrome 扩展程序或单击扩展程序图标时，func() 都会被触发，但是当我单击侦听器订阅的实际按钮 (Button) 时，什么也没有发生。我已经使用“检查弹出窗口”查看调试器并在控制台中使用 location.reload()，似乎 elem 是通过 getElementById() 正确设置的，但是在重新加载页面时立即触发事件，而不是在链接被点击。

如何让事件在点击而不是页面加载时触发？

【问题讨论】：

标签： javascript javascript-events google-chrome-extension

【解决方案1】：

像document.addEventListener('DOMContentLoaded', init());这样将函数传递给事件监听器

该函数被立即调用。正确的方法是这样做

document.addEventListener('DOMContentLoaded', init);

【讨论】：

是的，你在调用它之后传递了一个函数结果。按照这个答案的建议做或将函数内联为匿名。
在哪里可以找到活动名称？
MDN Event Reference
如果我们在函数中有参数怎么办？