Question

我成功创建了我的第一个Chrome扩展程序。它现在仅在单击扩展图标而不是在背景上运行时才会运行，这很好。但是，我想在我的扩展中添加更多操作，我一直在尝试使用扩展弹出窗口来运行其他功能，但我无法使其工作。它不一定是那样的，所以我愿意接受建议。我不想使用上下文菜单。我希望人们点击扩展图标并向他们显示“菜单”。

现在，我的扩展程序仅在找到有效页面（来自mydomain.com）时提醒消息，并且它找到名为“returnURL”的隐藏字段。它警告价值。

我希望能够添加点击图标的功能，而是显示包含多个选项的选项菜单。

这样的事情：

点击扩展图标并显示两个选项

获取响应URL（此选项将运行我现在拥有的当前功能）
做其他事情（所以我可以在其上执行另一个功能加载页面）

...如果我需要在我的扩展程序的未来版本中添加它们，还有更多选项。

如何修改我的扩展程序。

这是我的代码：

的manifest.json



    {
            "name": "Get Response URL",
            "version": "1.0",
            "manifest_version": 2,
            "browser_action": {
            "default_icon": "mkto_icon.png",
            "name": "Click to get URL"
            },
            "background":{
                "scripts":["background.js"]
            },
            "permissions":["http://mydomain.com/*"]
     }

background.js



    chrome.browserAction.onClicked.addListener(function (tab) { //Fired when User Clicks ICON
        if (tab.url.indexOf("http://mydomain.com/") != -1) { // Inspect whether the place where user clicked matches with our list of URL
            chrome.tabs.executeScript(tab.id, {
                "file": "contentscript.js"
            }, function () { // Execute your code
                console.log("Script Executed .. "); // Notification on Completion
            });
        }
    });

contentscript.js



    if (document.getElementsByName("returnURL")){
    alert("\nThe Response URL on this form is:\n\n" + document.getElementsByName("returnURL")[0].value);
    }

我按照我在Google Extensions开发者网站上找到的文档，但我无法使其正常工作。非常感谢您的帮助。

Answer 1

您无法拥有Chrome扩展程序的真实菜单。但是，您可以在单击按钮时显示HTML页面（弹出窗口）。您可以使用与菜单类似的方式设置此HTML页面的样式：

"browser_action": {
   "default_icon": "mkto_icon.png",
   "default_title": "Click here to open menu",
   "default_popup": "popup.html"
 },

将文件popup.html添加到您的扩展程序以及您要显示的任何内容。弹出页面加载的脚本可以加载内容脚本并与后台页面进行通信。

供参考：browser actions documentation。

向Chrome扩展程序添加图标菜单

1 个答案: