我正在尝试在右键菜单中创建一个基于用户操作动态的选项。如果用户选择了一些文本,然后右键单击,该选项将显示“显示它”。如果用户右键单击而未选择某些文本,则该选项将显示“首先选择一些文本”并显示为灰色。我想知道如何实现这个目标?
我目前拥有该选项,只有当用户选择了某些文字时才会显示该选项。我不确定如何修改它以满足我的第二个要求。
chrome.contextMenus.create ({
title:"Display It!", contexts:["selection"], onclick:function(info,tab) {
chrome.tabs.sendRequest(
tab.id,
{callFunction: "displaySidebar", info: info},
function(response) {console.log(response);}
);
}
});
答案 0 :(得分:10)
你不能把一个项目弄清楚...... Chrome已经付出了一些努力,只有当它的相关时才会出现上下文菜单项,这就是为什么我猜这里没有灰色选项。你的方式与Chrome试图实施的方式相悖,我认为你真的应该重新考虑你的方式 这样说,您可以使用chrome.contextMenus.update来更改菜单项 以下代码与您的方式一样好(严肃地说,重新考虑这个想法)....
function selectedTrueOnClick(info, tab) {
chrome.tabs.sendRequest(
tab.id, {
callFunction: "displaySidebar",
info: info
}, function(response) {
console.log(response);
});
}
function selectedFalseOnClick(info, tab) {
//
}
var contextMenuID = chrome.contextMenus.create({
title: "Select some text",
contexts: ["all"],
onclick: selectedFalseOnClick
});
function contextMenuUpdate(selected) {
if (selected) chrome.contextMenus.update(contextMenuID, {
title: 'You selected "%s"',
contexts: ["all"],
onclick: selectedTrueOnClick
});
else chrome.contextMenus.update(contextMenuID, {
title: "Select some text",
contexts: ["all"],
onclick: selectedTrueOnClick
});
}
contextMenuUpdate(false);
答案 1 :(得分:8)
我希望完成与原始帖子相同的功能,并且能够使用一些消息传递使其工作。无论是否不好,我使用enabled(true / false)contextMenu属性来保留我的上下文菜单选项,但是显示为灰色。
我创建了一个上下文菜单。重要的财产是身份证。其余部分大多是随意的,因为它会动态改变。
在content.js
中//This event listener will determine if the context menu should be updated
//based on if the right-button was clicked and if there is a selection or not
document.addEventListener("mousedown", function(event){
if (event.button !== 2) {
return false;
}
var selected = window.getSelection().toString();
if(event.button == 2 && selected != '') {
//get selected text and send request to bkgd page to create menu
chrome.extension.sendMessage({
'message': 'updateContextMenu',
'selection': true});
} else {
chrome.extension.sendMessage({
'message': 'updateContextMenu',
'selection': false});
}
}, true);
在background.js中:
//add a message listener that will modify the context menu however you see fit
chrome.extension.onMessage.addListener(function(request, sender, sendResponse) {
if (request.message == 'updateContextMenu') {
if (request.selection) {
chrome.contextMenus.update('contextMenuId',{
'title': 'New Title',
'enabled': true,
"contexts": ["all"],
'onclick': someFunction
});
} else {
chrome.contextMenus.update('contextMenuId',{
'title': 'Select some text first',
'enabled': false,
"contexts": ["all"]
});
}
} else {
sendResponse({});
}
});
//The original context menu. The important property is the id. The rest is mostly
//arbitrary because it will be changed dynamically by the listener above.
chrome.contextMenus.create({
'id': 'contextMenuId',
'enabled': false,
'title': 'Some Title',
"contexts": ["all"]
});