我正在尝试创建一个上下文菜单选项,该选项将一些文本复制到系统剪贴板。
当前,我只是复制硬编码的字符串文字,但是我想知道如何更改它以复制选定的文本。具体来说,我不知道如何正确创建createProperties
对象(请参阅底部)
据我了解,这只能通过后台页面完成。
我有以下背景页面:
background.html
<textarea id="temp"></textarea>
<script src="context.js"></script>
context.js
如下:
chrome.contextMenus.create({
"title": "Freedom",
"contexts": ["editable"],
"onclick" : copyToClipboard
});
function copyToClipboard()
{
var tempNode = document.getElementById("temp");
tempNode.value = "some text";
tempNode.select();
var status = document.execCommand('copy',false,null);
if(status) alert('successful');
else alert('unsuccessful');
}
我manifest.json
的如下:
{
"manifest_version": 2,
"name": "Freedom",
"description": "Provides users useful and fun context menu options that they can access from anywhere.",
"version": "1.0",
"permissions": [
"contextMenus",
"clipboardWrite"
],
"background": {
"page": "background.html"
}
}
我显然是错误地声明了chrome.contextMenus.create()函数。我已经阅读了文档,只能想象我没有正确创建createProperties
对象。
我一直在尝试模仿以下来源:
Chrome扩展程序中按上下文菜单项可以调用内容脚本的方法吗?
http://paul.kinlan.me/chrome-extension-adding-context-menus/
其他一些相关的问题是:
文档中的“ createProperties”是传递给chrome.contextMenus.create
方法的字典(即带有“ title”,“ contexts”等的东西)
所述onclick
的事件描述chrome.contextMenus.create
指出函数接收两个参数。第一个参数(“ info”)是字典,其中包含有关所选文本的信息。第二个参数(“选项卡”)包含有关选项卡的信息(在您的情况下,虽然不需要)。
“信息”字典具有属性“ selectionText”,该属性保存单击上下文菜单项时所选择的文本。可以在您的代码中使用它,如下所示:
function copyToClipboard(info) {
var tempNode = document.getElementById("temp");
tempNode.value = info.selectionText; // <-- Selected text
tempNode.select();
document.execCommand('copy', false, null);
}
那将解决您的直接问题。
除此之外,可以通过将背景页面转换为事件页面来扩展您的扩展程序。与后台页面相比,事件页面的主要优点是,扩展程序在后台闲置时不会不必要地使用内存。
// background.js
// Register context menu
chrome.runtime.onInstalled.addListener(function() {
chrome.contextMenus.create({
"id": "some id", // Required for event pages
"title": "Copy selected text to clipboard",
"contexts": ["editable"],
// "onclick" : ... // Removed in favor of chrome.contextMenus.onClicked
});
});
// Register a contextmenu click handler.
chrome.contextMenus.onClicked.addListener(copyToClipboard);
这是最小的manifest.json(注意"persistent": false
键,它指定您要使用事件页)
{
"manifest_version": 2,
"name": "Copy selected text to clipboard",
"version": "1.0",
"permissions": [
"contextMenus",
"clipboardWrite"
],
"background": {
"page": "background.html",
"persistent": false
}
}
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句