我正在创建一个google chrome扩展程序,使用本地存储来保存我最后点击的按钮值时遇到问题。我这样做是为了使退出弹出窗口后,最后单击的按钮继续显示。我觉得我已经接近了,但是由于某种原因,我不想在退出弹出窗口后显示相同的按钮。我尝试使用本地存储,因此将保存最后一个值,因此按钮保持不变。
但是,当我在检查时转到应用程序>>本地存储时,看不到任何lastclicked值被保存在其中。
我可能正在处理此错误,但是有人知道这个问题可能是什么吗?
//Start and Stop buttons for logging
const btnStart = document.getElementById("click-start");
const btnStop = document.getElementById("click-stop");
var lastClicked = document.getElementById("btnStartID");
//button to start/stop logging
document.addEventListener("DOMContentLoaded", function () {
//get lastClicked first to make decisons
chrome.storage.local.get(['lastClicked'], function(result) {
if (result == document.getElementById("btnStartID")) {
//works
btnStart.style.display= "none";
btnStop.style.display= "block";
console.log("last clicked is start button");
Logger(true);
} else if (result == document.getElementById("btnStopID")) {
//not working
btnStart.style.display= "block";
btnStop.style.display= "none";
Logger(false);
console.log("last clicked is stop button");
} else {
//to see if its grabbing id elements
console.log("else statement");
Logger(true);
}
//works
btnStart.addEventListener("click", function() {
lastClicked = document.getElementById("btnStartID");
Logger(true);
chrome.storage.local.set({'lastClicked': lastClicked}, function() {
console.log('logging started successful');
});
});
btnStop.addEventListener("click", function() {
lastClicked = document.getElementById("btnStopID");
Logger(false);
chrome.storage.local.set({'lastClicked': lastClicked}, function() {
console.log('logging stopped successful');
});
});
});
});
chrome.storage.local.get(['key'], function(result) {
console.log('value currently is ' + result.key);
});
//attempt to get start/stop logging buttons to work--underwork
function Logger(isLogging) {
let logger =''
if (isLogging){
btnStart.style.display= "none";
btnStop.style.display= "block";
logger = 'logging'
addRow();
} else {
btnStart.style.display= "block";
btnStop.style.display= "none";
logger = 'not logging'
}
//using storage API to save data for last btn pressed--underwork
chrome.storage.local.set({key: logger}, function() {
console.log('value is set to ' + logger);
});
}
你只能将字符串保存到本地存储中,因此Chrome会忽略你尝试保存整个按钮的尝试,更好的解决方案是保存按钮ID,这样你就可以
if (result.lastClicked == "btnStartID") {
...
chrome.storage.local.set({'lastClicked': lastClicked.id}
您好,我一直在接收Uncaught TypeError:无法读取HTMLButtonElement上null的属性'id'。<anonymous>错误@Nadia Chibrikova
看起来您的lastClicked为null,就保存到存储而言,这不是一个大问题,因为您知道id,所以您只是根据此id找到了元素。实际上,您不需要查找元素,因为您无需对其进行任何操作,只需保存id。但是-单击哪个按钮会收到错误消息?您的ID似乎有点不一致,是“点击开始”还是“ btnStartID”?
单击“单击开始” /“单击停止”。“单击开始” /“单击停止”是我的按钮,它们显示在我的html页面上。我正在尝试跟踪最后一次单击的内容,所以btnStartID就是我要显示在本地存储中的内容。如果那是有道理的。
Tbh我不确定btnStartID应该做什么。尝试将其替换为点击开始,停止也一样
@Nadia Chibrikova谢谢!实际上,它可以正常工作。我想我正在以错误的方式进行操作。