chrome 扩展中的浏览器事件监听器不起作用

Question

单击工具栏中的扩展程序图标（在右上角）时，我试图执行一个函数。 我在 background.js 文件中添加了chrome.browserAction.onClicked.addListener但它不起作用。 请帮我。

最终，我的目标是通过我在 iframe 标记中使用的http://localhost:3000中的 HTML 元素设置不同的图标。 （检查 localhost:3000 中是否有特定元素 -> 设置图标）

我遵循的参考： https ://developer.chrome.com/extensions/samples#search:a%20browser%20action%20which%20changes%20its%20icon%20when%20clicked

我的代码如下。

清单.json

{
  "name": "test",
  "version": "1.0",
  "description": "test",
  "manifest_version": 2,
  "background": {
    "scripts": [
      "background.js"
    ],
    "persistent": false
  },
  "permissions": [
    "storage"
  ],
  "browser_action": {
    "default_title": "test",
    "default_popup": "popup.html"
  }
}

背景.js

chrome.browserAction.onClicked.addListener(() => {
  console.log('test for browser action');
});

popup.html

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
</head>

<body>
  <iframe src="http://localhost:3000" width="400" height="600"></iframe>
  <script src="./background.js" charset="UTF-8"></script>
</body>

</html>

Answer 1

在 manifest.json 中指定default_popup会禁用chrome.browserAction.onClicked事件。

解决方案：只需将代码放在 popup.js 中，然后像任何其他脚本一样在 popup.html 中加载它。

popup.html

  <script src=popup.js></script>
</body>
</html>

popup.js

console.log('This will run every time the popup is opened');

要检查弹出窗口及其控制台，请在弹出窗口内右键单击，然后单击“检查”。

请注意，您不需要后台脚本。 后台脚本在隐藏的后台页面中运行，因此绝不应在其他任何地方使用。 从 popup.html 中删除它。

PS您使用了错误的参考扩展名。 通过 Ctrl-F 使用内置浏览器搜索来搜索popup.html （不是页面上的搜索输入）。

chrome 扩展中的浏览器事件监听器不起作用

问题描述

1 个解决方案

解决方案1
0 已采纳 2020-10-04 11:41:51

chrome 扩展中的浏览器事件监听器不起作用

问题描述

1 个解决方案

解决方案1 0 已采纳 2020-10-04 11:41:51

解决方案1
0 已采纳 2020-10-04 11:41:51