如何限制上下文菜单仅出现在Chrome扩展程序中某些选定的文本中？ [英] How do I restrict context menus to appear only for certain selected text in a Chrome extension?

问题描述

我提出了一个非常简单的铬扩展程序它允许用户突出显示一个数字DOI，右键单击并选择解析DOI，然后将它们发送到关联的网页。现在，这是在background.html中完成的：

  chrome.contextMenus.create（{
title ：解析DOI，
type：normal，
contexts：[selection]，
onclick：getClickHandler（）
}）; 
  

我想限制上下文菜单选项仅在它们突出显示的文本以10 。有关如何做到这一点的任何建议？是否需要等待Context Menus模块变得更高级？

解决方案

您需要控制内容菜单创建内容脚本。动态菜单的创建/删除应该执行得非常快，延迟对用户来说是不明显的。

• 在内容脚本中添加mousedown事件监听器，请检查选择是否满足您的模式。


• 根据选择是否与模式匹配，向请求创建或删除菜单的后台页面发送请求。

沿着这些线条（未测试）：

content_script.js： document.addEventListener（mousedown，function（event）{
var selection = window.getSelection（） ）.toString（）;
if（selection.match（/ ^ 10 \。/））{
chrome.extension.sendRequest（{cmd：create_menu}）;
} else {
chrome.extension.sendRequest（{cmd：delete_menu}）;
}
}，true）;

background.html：

  chrome.extension.onRequest.addListener（函数（请求）{
如果（request.cmd == create_menu）{
 chrome.contextMenus .removeAll（函数（）{
 chrome.contextMenus.create（{
 的标题： 解决DOI，
 的类型： 正常，
 上下文 ：[selection]，
onclick：getClickHandler（）
}）; 
}）; 
} else if（request.cmd ==delete_menu）{ 
 chrome.contextMenus.removeAll（）; 
} 
}）; 
  

I made a very simple chrome extension which allows users to highlight a DOI number, right-click and choose "Resolve DOI", and it sends them to the associated web page. Right now, this is done in background.html with:

chrome.contextMenus.create({
"title" : "Resolve DOI",
"type" : "normal",
"contexts" : ["selection"],
"onclick" : getClickHandler()
});

I would like to restrict the context menu option to only appear if the text they highlight begins with "10." Any suggestions on how to do this? Do I need to wait for the Context Menus module to become more advanced?

解决方案

You would need to control content menu creation from a content script. Dynamic menu creation/deletion should execute pretty fast and the delay will be unnoticeable for a user.

• Add mousedown event listener in a content script and check there whether selection satisfies your pattern.
• Based on whether or not selection matches the patterrn, send a request to a background page asking to create or delete the menu.

Something along those lines (not tested):

content_script.js:

document.addEventListener("mousedown", function(event){
    var selection = window.getSelection().toString();
    if(selection.match(/^10\./)) {
        chrome.extension.sendRequest({cmd: "create_menu"});
    } else {
        chrome.extension.sendRequest({cmd: "delete_menu"});
    }
}, true); 

background.html:

chrome.extension.onRequest.addListener(function(request) {
    if(request.cmd == "create_menu") {
        chrome.contextMenus.removeAll(function() {
            chrome.contextMenus.create({
                "title" : "Resolve DOI",
                "type" : "normal",
                "contexts" : ["selection"],
                "onclick" : getClickHandler()
            });
        });
    } else if(request.cmd == "delete_menu") {
        chrome.contextMenus.removeAll();
    }
});

这篇关于如何限制上下文菜单仅出现在Chrome扩展程序中某些选定的文本中？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！