我正在尝试获取所选文本并在popup.html(扩展名)中显示。 我能够使用chrome extension api的消息传递技术传递数据,但每次我点击弹出窗口时,它都会清除存储的数据。 所以我想到了使用存储api。我设法使用chrome.storage.local.set存储选定的文本,并使用chrome.storage.local.get检索它。 但是弹出点击数据不会持续存在。
//编辑: 添加所有文件。
我想出了这个问题。显然,我尝试使用chrome.storage.set进行保存是覆盖以前的值而不是保存新值。
chrome.storage.local.get(null, function(items) {
var arr = Object.keys(items).map(function (key) {return items[key]});
console.log(arr.length); // This shows the length as 1 everytime
for(var i = 0; i < arr.length;i++){
getMsg(arr[i]);
}
});
如何不每次覆盖值并保存新值?
mycontent.js
document.addEventListener('keydown', function(e) {
if (e.keyCode == 67 && event.ctrlKey) { // ascii C = 67
getSelectionText();
chrome.runtime.sendMessage({method: 'setText', output: text});
}
});
var text;
function getSelectionText() {
if (window.getSelection) {
text = window.getSelection().toString();
}
else if(document.selection !="" && document.selection.type == "Control") {
text = document.selection.createRange().text;
}
if(text != ""){
chrome.storage.local.set({value: text}, logger(text));
return text;
}
}
function logger(text){
console.log(text + ' saved123');
}
Popup.js
chrome.storage.local.get(null, function(items) {
getMsg(items.value);
});
function getMsg(value){
var textNode = document.createTextNode(value);
var node = document.createElement("li");
node.id = "textSpan";
node.onclick = function(){
callFunc(this);
}
var textBox = document.createElement("span");
textBox.appendChild(textNode);
node.appendChild(textBox);
var element = document.getElementById('list-view');
element.insertBefore(node, element.childNodes[0]);
};
function callFunc(loc){
removeTask(loc,outerDiv.id,true);
loc.removeChild();
}
function removeTask(id1, id, flag){
if (flag != false){
var pasted = document.getElementById(id1);
var pasted = id1;
alert(pasted.innerText);
document.getElementById(id).value = pasted.innerText;
id="";
pasted.remove();
}
}
的manifest.json
{
"manifest_version": 2,
"name": "Copy",
"description": "current page",
"version": "1.0",
"browser_action": {
"default_icon": "icon.png",
"default_popup": "popup.html"
},
"background": {
"persistant": true
},
"permissions": [
"storage",
"activeTab"
],
"content_scripts": [
{
"matches":
["http://*/*" , "https://*/*"],
"js": ["myContent.js"]
}
]
}
Popup.html
<!DOCTYPE html>
<!--
This page is shown when the extension button is clicked, because the
"browser_action" field in manifest.json contains the "default_popup" key with
value "popup.html".
-->
<html>
<head>
<title>Extension's Popup</title>
<!--
- JavaScript and HTML must be in separate files: see our Content Security
- Policy documentation[1] for details and explanation.
-
- [1]: https://developer.chrome.com/extensions/contentSecurityPolicy
-->
<!--<-script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
<meta name='viewport' content='width=device-width,initial-scale=1,maximum-scale=1'>
-->
<script type="text/javascript" src="popup.js"></script>
</head>
<body>
<div class="col-md-6 text-center">
<div id="displayContent">
<ol id="list-view">
</ol>
</div>
</div>
</body>
</html>
我设法通过弹出窗口发送数据。但每次我点击弹出窗口,数据都会被清除。如何使其在页面刷新和弹出式点击中保持不变?