我正在编写我的第一个Firefox扩展插件,它主要通过文本框上的右键单击上下文菜单工作。
我希望能够根据用户在其上执行右键单击事件的文本框中当前是否选择了任何文本来显示/隐藏单个选项。
使用内容脚本和背景脚本之间的消息,我已经能够了解它的基础知识。
content.js...
window.oncontextmenu = function(e) {
if (e && e.target && (e.target.nodeName == "TEXTAREA" || (e.target.nodeName == "INPUT" && e.target.type == "text"))) {
var selectedText = "";
if (e.target.selectionStart < e.target.selectionEnd) {
selectedText = e.target.value.substring(e.target.selectionStart, e.target.selectionEnd);
}
browser.runtime.sendMessage({ "action": "additemvisible", "selectedText": selectedText});
}
};
background.js...
browser.runtime.onMessage.addListener(function(message) {
if (message && message.action) {
if (message.action == "additemvisible") {
addSelectedText = message.selectedText;
browser.menus.update("addtextitem", { visible: addSelectedText != "" });
}
}
});
问题在于,显示上下文菜单后,该消息似乎可以传递到background.js脚本,因此菜单项的可见性基于先前的状态,而不是当前的状态。
有没有更好的方法可以编写此代码,以便基于当前情况显示contextMenu项?
最佳答案
您可以使用contexts
属性设置何时显示上下文菜单项。
就您而言,您似乎对网页上的所选文本感兴趣,有一个selected
上下文(可以在here中找到上下文的完整列表)。
单击菜单项时,选定的文本将被发送到菜单项的Click侦听器,下面是一个示例:
browser.contextMenus.create({
id: "log-selection",
title: "Process Selection",
contexts: ["selection"],
onclick: (info, tab) => {
console.log(info.selectionText);
}
});