Javascript Chrome 扩展程序中的上下文菜单
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/13783500/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Context menus in Chrome extensions
提问by UserIsCorrupt
I've searched and searched and searched for a solution to this but every source I come across seems to assume I already have profound knowledge of Chrome extensions, even Google's help pages
我已经搜索并搜索并搜索了解决方案，但我遇到的每个来源似乎都假设我已经对 Chrome 扩展程序有深入的了解，甚至谷歌的帮助页面
I know the very basics of Chrome extensions and I made one with some basic content scripts. However, now I'm looking to make one that involves context menus.
我了解 Chrome 扩展程序的基础知识，并使用一些基本的内容脚本制作了一个扩展程序。但是，现在我希望制作一个涉及上下文菜单的菜单。
Let's say when you highlight words and right-click them, you see the option Search '<highlighted words>' on Googleand when clicked, it opens http://www.google.com/search?q=<highlighted words>in a new tab. I know this exists in Chrome and I'm sure there have been a billion extensions replicating it, but this is only an example for me to build off of.
假设当您突出显示单词并右键单击它们时，您会看到该选项Search '<highlighted words>' on Google，单击后，它会http://www.google.com/search?q=<highlighted words>在新选项卡中打开。我知道这在 Chrome 中存在，而且我确信已经有 10 亿个扩展复制了它，但这只是我构建的一个例子。
How can I do this?
我怎样才能做到这一点？
回答by Bart?omiej Sza?ach
Script should look like this:
脚本应如下所示：
function getword(info,tab) {
console.log("Word " + info.selectionText + " was clicked.");
chrome.tabs.create({
url: "http://www.google.com/search?q=" + info.selectionText
});
}
chrome.contextMenus.create({
title: "Search: %s",
contexts:["selection"],
onclick: getword
});
And manifest.json:
和 manifest.json：
{
"name": "App name",
"version": "1.0",
"manifest_version": 2,
"description": "Your description",
"permissions": [
"contextMenus"
],
"background": {
"scripts": ["script.js"]
}
}
Here you have how to load extension: http://developer.chrome.com/extensions/getstarted.html
这里你有如何加载扩展：http: //developer.chrome.com/extensions/getstarted.html
回答by anhquan
The answer from Bartlomiej Szalach is too old. It will not work on Chrome Version 80.0.3987.163 (April 2020).
Bartlomiej Szalach 的答案太旧了。它不适用于 Chrome 版本 80.0.3987.163（2020 年 4 月）。
According to the documentation,
根据文档，
onclick: A function that is called back when the menu item is clicked. Event pages cannot use this; instead, they should register a listener for contextMenus.onClicked.
onclick：菜单项被点击时回调的函数。活动页面不能使用这个；相反，他们应该为 contextMenus.onClicked 注册一个监听器。
The background.js should be modified as follows:
background.js 应该修改如下：
const CONTEXT_MENU_ID = "MY_CONTEXT_MENU";
function getword(info,tab) {
if (info.menuItemId !== CONTEXT_MENU_ID) {
return;
}
console.log("Word " + info.selectionText + " was clicked.");
chrome.tabs.create({
url: "http://www.google.com/search?q=" + info.selectionText
});
}
chrome.contextMenus.create({
title: "Search: %s",
contexts:["selection"],
id: CONTEXT_MENU_ID
});
chrome.contextMenus.onClicked.addListener(getword)