Question

我正在尝试编写一个非常简单的Chrome扩展程序。此时的所有内容都是一个弹出式html文件，它会在单击浏览器操作图标时尝试显示警报。我显然是在做错事，因为警报不会触发。

的manifest.json

{
  "name": "Simple",
  "description": "Simple",
  "version": "1.0",
  "browser_action": {
    "default_title": "Simple",
    "default_icon": "images/icon.png",
    "default_popup": "popup.html"
  },
  "manifest_version": 2
}

popup.html

<html>
<head>
    <script>
        //Executed when the extension's icon is clicked
        chrome.browserAction.onClicked.addListener(function(tab) 
        { 
            alert("gah");
        });
    </script>
</head>

<body>
    Hello World!
</body>
</html>

我也尝试过：

<html>
<head>
    <script>

        function onPageLoad()
        {
            //Executed when the extension's icon is clicked
            chrome.browserAction.onClicked.addListener(function(tab) 
            { 
                alert("gah");
            });
        }

    </script>
</head>

<body onload="onPageLoad()">
    Hello World!
</body>
</html>

基于响应的更新 感谢您的答复。我做了以下更改，但仍然没有被称为browser.Action.onClicked（）（您可以看到，而不是我正在使用console.log（）的警报。（显示全局范围内的日志，里面的一个回调不是。）

的manifest.json

{
  "name": "Simple",
  "description": "Simple",
  "version": "1.0",
  "permissions": ["tabs", "http://*/*", "https://*/*"],
  "background": {
    "persistent": false,
    "scripts": ["popup.js"]
  }, 
  "browser_action": {
    "default_title": "Simple",
    "default_icon": "images/icon.png",
    "default_popup": "popup.html"
  },
  "manifest_version": 2
}

popup.html

<html>
<head>
    <script type="text/javascript" src="popup.js"></script>
</head>

<body>
    <div style="white-space: nowrap">
        Hello World!
    </div>
</body>
</html>

popup.js

console.log("Running at global scope")

//Executed when the extension's icon is clicked
chrome.browserAction.onClicked.addListener(function(tab) 
{ 
    console.log("Running insode of addListener()");
});

Answer 1

chrome.browserAction.onClicked无法在弹出窗口中使用。它没有多大意义 - 您已经开始监听点击后点击的浏览器操作图标。它可以再次单击，但随后将关闭弹出窗口，并在发生任何事情之前终止侦听器。 chrome.browserAction.onClicked应该在后台页面上使用，并且仅在不使用浏览器操作的弹出窗口时使用：

如果浏览器操作有弹出窗口，则不会触发此事件。

source

你应该写一下：

<script>
        alert("gah");
</script>

但我不确定警报是否在弹出窗口中起作用。最好尝试类似的事情：

<script>
        document.getElementsByTagName('body')[0].innerHTML = "gah";
</script>

修改

您的扩展程序还有一件事需要解决。正如@Cody在他的回答中建议的那样，你不应该使用内联脚本。出于安全原因，它被阻止。获取上面建议的代码并将其放入单独的javascript文件中，然后将其包含在popup.html head：
中
<script src='script.js' type='text/javascript'></script>

Answer 2

根据修订后的Chrome安全政策，Chrome扩展程序将无法再使用popup.html http://developer.chrome.com/extensions/contentSecurityPolicy.html#jsexecution

中的内嵌javascript

您必须创建一个JS文件，并在Manifest.json中说明它的存在，如下所示：

<强>的manifest.json

{
  "name": "Simple",
  "description": "Simple",
  "version": "1.0",
  "background": {    
    "scripts": ["bg.js"] //Here you can name the JS file that you have created
  },
  "browser_action": {
    "default_title": "Simple",
    "default_icon": "images/icon.png",
    "default_popup": "popup.html"
  },
  "manifest_version": 2
}

<强> popup.html

<html>
<head>
    <script>
        //Executed when the extension's icon is clicked         
            alert("gah");
    </script>
</head>

<body>
    Hello World!
</body>
</html>

您可以在清单版本2之后开始构建Chrome扩展程序，并参考http://developer.chrome.com/extensions/overview.html和http://developer.chrome.com/extensions/getstarted.html

Chrome扩展程序：未调用browserAction.onClicked.addListener（）

2 个答案: