popup.html 中的按钮不起作用

Question

我有一个 popup.html，我认为这是非常简单的侦听器事件。

这是我的 popup.html:

<!DOCTYPE html>
<html>
<body>
  <button id="button">Starting Now</button>

  <script>
    function blah(){
      alert("blah");
    }

    $(document).ready(function(){ 
      document.getElementById('button').addEventListener("click", blah);
    });
  </script>
</body>
</html>

按下按钮时没有提示；我做错了什么？

Answer 1

从普通网页的角度来看，您的代码是可以的，但是从 Chrome 扩展开发的指南来看，您需要检查 Content Security Policy (CSP) 上面写着：

Inline JavaScript will not be executed. This restriction bans both inline <script> blocks and inline event handlers (e.g. <button onclick="...">).

因此，测试代码的方法是将脚本代码放在单独的 .js 文件中，然后在 html 中引用它。

正如 Xan 在关于 alert() 用法的评论中所建议的那样：
代替 alert() 如果目的，您可以使用简单的 console.log()只是为了测试按钮点击，否则如果你真的想要弹出警报之类的东西然后创建一个模式对话框。

仅供参考（估计OP已经知道了）：

因为您正在使用 jQuery check this guideline also about loading jQuery or other libraries.

popup.html 中的按钮不起作用

button in popup.html not working

javascript

google-chrome-extension