文本选择并在上下文菜单chrome扩展中显示

Question

我一直在研究一个小的Chrome扩展程序,但我似乎无法解决这个问题,并希望有人能够以全新的视角审视它.

目标是创建一个chrome扩展,使您可以在任何给定的网站上选择文本,并显示一个选项,使用contextmenu项目将选择发送到另一个网站.

我的manifest.json看起来像这样:

{
"name": "Context Menu Search",
"description": "Opens the selected text as keyword in a new window",
"version": "0.1",
"permissions": ["contextMenus"],
"background_page": "background.html"
}

然后是background.html:

<script src="rightclick.js"></script>

和rightclick.js:

var selection_callbacks = []; 
 function getSelection(callback) { 
 selection_callbacks.push(callback); 
    chrome.tabs.executeScript(null, { file:"selection.js" }); 
  }; 
  chrome.extension.onRequest.addListener(function (request) { 
    var callback = selection_callbacks.shift(); 
    callback(request); 
  });

function sendSearch(selectedText) {
var serviceCall = 'http://www.google.com/search?q=' + selectedText;
chrome.tabs.create({url: serviceCall});
}
var tx = getSelection();
var title = "Test '" + tx + "' menu item";
var id = chrome.contextMenus.create({"title": title, "contexts":[selection],
                                   "onclick": sendSearch(tx)});
console.log("selection item:" + id);

加上selection.js:

chrome.extension.sendResponse(window.getSelection().toString());

到目前为止,上下文菜单创建工作正常,但根本不显示所选文本.如果有人对如何解决这个问题有任何建议以及简化脚本,我将不胜感激.

非常感谢你.

Answer 1

UPDATE

我只是查看了文档,所有这些都可以更简单地完成,没有任何内容脚本和回调:

chrome.contextMenus.create({
    title: "Test %s menu item", 
    contexts:["selection"], 
    onclick: function(info, tab) {
        sendSearch(info.selectionText);
    }
});

这就是您所需要的,因为您可以%s在菜单标题中使用以获取所选文本.

(不再需要以下所有内容)

您的getSelection()方法不返回所选文本,它只是将内容脚本注入页面.稍后会收到所选文本onRequest,然后将其作为参数从回调数组传递给回调函数.

这部分:

var tx = getSelection();
var title = "Test '" + tx + "' menu item";
var id = chrome.contextMenus.create({"title": title, "contexts":[selection],
                                   "onclick": sendSearch(tx)});
console.log("selection item:" + id);

需要改为这样的事情:

getSelection(function(tx) { 
    var title = "Test '" + tx + "' menu item";
    var id = chrome.contextMenus.create({"title": title, "contexts":["selection"],
                                       "onclick": sendSearch(tx)});
    console.log("selection item:" + id);
})

但是我会selection_callbacks完全摆脱那个数组,因为我觉得不需要它:

chrome.extension.onRequest.addListener(function (request) { 
    var tx = request;
    var title = "Test '" + tx + "' menu item";
    var id = chrome.contextMenus.create({"title": title, "contexts":["selection"],
                                       "onclick": sendSearch(tx)});
    console.log("selection item:" + id);
});

还要注意"contexts":[selection]需要"contexts":["selection"],并且"onclick": sendSearch(tx)需要像这样:

"onclick": function(info, tab) {
    sendSearch(info.selectionText);
}