javascript - Chrome 扩展上下文菜单 : Get title %s as a string

Question

我在编写我的第一个 Chrome 扩展程序时遇到了问题。我想要的功能是，当用户右键单击所选单词时，我希望生成的上下文菜单将该单词显示为菜单项，并将文本记录为字符串以供以后使用。通过使用 %s 作为 title 属性的值，创建菜单时它将显示该文本。我似乎也无法弄清楚如何在变量中捕获它。代码如下:

chrome.storage.onChanged.addListener(function() {
    chrome.storage.local.set({'wasFired': false});
    console.log("event firing");

    // begin creation of menu
    var master = chrome.contextMenus.create({
        "id": "SynoStart",
        "title": '%s',
        "contexts":["selection"]
    });
});

如果我在 contextmenu.create 中运行一个函数并将对象记录到控制台，我可以深入挖掘并解析出标题。不幸的是，它返回为 %s 而不是用户选择的文本(下面的代码)。

chrome.storage.onChanged.addListener(function() {
    chrome.storage.local.set({'wasFired': false});
    console.log("event firing");

    //begin creation of menu
    var master = chrome.contextMenus.create({
    "id": "SynoStart",
    "title": '%s',
    "contexts":["selection"]
    },
    function(){
        console.log(this.args[0].title); //returns "%s"
    });
});

如果我让回调完成并运行一个简单的 console.log(master); 它只返回 ID 作为字符串(在本例中为“SynoStart”)。运行 console.log(master.title); 返回未定义。示例如下:

    chrome.storage.onChanged.addListener(function() {
        chrome.storage.local.set({'wasFired': false});
        console.log("event firing");

        //begin creation of menu
        var master = chrome.contextMenus.create({
            "id": "SynoStart",
            "title": '%s',
            "contexts":["selection"]
        });
        console.log(master); //returns "SynoStart"
        console.log(master.title); //returns undefined
    });

有什么方法可以在创建此菜单对象时动态提取其标题属性(作为字符串)？

这是我关于 SO 的第一个问题，所以请随时告诉我应该如何改进它。非常感谢!

Answer 1

chrome.contextMenus.create 的 Chrome 文档表示您可以指定一个接收两个参数的回调函数，第一个是 OnClickData 类型，第二个是 Tab 类型。他们文档中的一些当前错误导致无法访问 OnClickData 的描述。幸运的是，你仍然可以在 Opera's documentation 中阅读它.在那里您会看到有一个带有描述的 selectionText 字段:“上下文选择的文本，如果有的话。”

请注意，菜单上单击事件的回调函数被指定为创建详细信息的 onclick 字段。指定为 chrome.contextMenus.create 的第二个参数的回调函数只是为了报告您是否创建了菜单项。

因此，您的代码可以是:

var master = chrome.contextMenus.create({
    "id": "SynoStart",
    "title": '%s',
    "contexts":["selection"]
    "onclick": function(onClickData, tab){
        console.log(onClickData.selectionText);
    });
}