Question

自昨天以来，我一直在努力解决这个问题，而且我已经没有想法弄清楚发生了什么。

我正在开发一个带有弹出式菜单的Chrome扩展程序，其中包含一些按钮可以触发某些事件。问题是，当单击图标扩展名时，它不会显示popup.html，而只是使用按钮触发所有相关事件。

我原来的扩展程序有一个持久的后台脚本，所以当我调试它时，显示的错误是“无法读取属性'addeventlistener'的null”。我已经查了一下，显然，它与popup.html文件中script src行的位置有关。我尝试重新安置它但没有改变。

在尝试了许多替代方法以其他方式执行相同操作并将我的代码与其他示例扩展进行比较之后，我创建了一个非常简单的扩展来演示我正在处理的问题。它只是一个三按钮弹出窗口，当您单击每个按钮时，应显示一条消息，显示一些文本。文件是：

popup.html

<html>
  <head>
    <script src="popup.js"></script>
  </head>
  <body>
    <button id="OpenButton">Open</button>
    <button id="StartButton">Start</button>
    <button id="StopButton">Stop</button>
  </body>
</html>

popup.js

function open(){alert("open");}
function start(){alert("start");}
function stop(){alert("stop");}


document.addEventListener('DOMContentLoaded', function() {
  document.getElementById('OpenButton').addEventListener(
      'click', open());
  document.getElementById('StartButton').addEventListener(
      'click', start());
  document.getElementById('StopButton').addEventListener(
      'click', stop());
});

的manifest.json

{
  "name": "A browser action with a popup that displays a message",
  "description": "Display a message",
  "version": "1.0",
  "permissions": [
    "tabs", "http://*/*", "https://*/*"
  ],
  "browser_action": {
      "default_title": "Display this message.",
      "default_icon": "icon.png",
      "default_popup": "popup.html"
  },
  "manifest_version": 2
}

基本上，我采用了一个示例扩展（它提供了一个带有4个按钮的弹出框来更改当前页面的背景颜色）并进行了编辑。这个扩展工作正常，但是在我做的这个新扩展中，当你点击扩展图标时，所有三个消息都会一个接一个地显示，并且没有弹出窗口。

我看不出冲突在哪里，我找不到同样问题的任何问题。任何建议都非常感谢。

问候。

Answer 1

打开alert()会导致弹出窗口失去焦点。

反过来，立即关闭它。

请勿在弹出式窗口中使用console.log()进行调试，使用select p.* from person where pid in (Select m.pid from mapping m where m.aid in (select aid from attribute a where a.d = "something"))，如果您右键单击扩展程序的浏览器操作并选择＆，则可以访问其输出＃34;检查弹出窗口＆＃34;。

弹出窗口未显示在Chrome扩展程序中，但在点击图标

1 个答案: