所以我想保存用户选择的主题,因此我选择弹出窗口来显示它们。每次我关闭标签(3次之后)或退出chrome时,它都会忘记我的选择。
我的选项.html
<html>
<head>
<script src="options.js"></script>
<link href='https://fonts.googleapis.com/css?family=Raleway:400,300,200,100' rel='stylesheet' type='text/css'>
</head>
<body>
<center>
<label class="paylabel" for="cardtype">Theme:</label>
<select id="cardtype" name="cards">
<option value="selectcard">--- Please select ---</option>
<option value="op1">Theme 1</option>
<option value="op2">Theme 2</option>
</select>
</center>
<br />
<br />
<br />
<br />
<h1 style="font-family:Raleway; font-weight:200; float:left">Theme 1</h1>
<h1 style="font-family:Raleway; font-weight:200; float:Right">Theme 2</h1>
<br />
<br />
<br />
<br />
<br />
<br />
<img src = "screen2.png"; alt="" style="float:left"/>
<img src = "screen1.png"; alt="" style="float:right"/>
</body>
</html>
Options.js:
time=setInterval(function(){
var ddl = document.getElementById("cardtype");
var selectedValue = ddl.options[ddl.selectedIndex].value;
localStorage["inputText"] = selectedValue;
var myvar = localStorage["inputText"];
if (myvar == "op2")
{
chrome.browserAction.setPopup({
popup: 'popup.html'
});
}
else{
chrome.browserAction.setPopup({
popup: 'popup2.html'
});
}
},1000);
谢谢。
- 将
<script src="options.js"></script>
移到关闭的</body>
标记之前,以便只有在解析和加载整个文档时才会执行脚本代码 - 不要使用
setInterval
,而是使用适当的on change侦听器
var element = document.getElementById("cardtype");
element.value = localStorage.inputText || 'op1';
element.addEventListener("change", function(e) {
var selectedValue = this.value;
localStorage.inputText = selectedValue;
chrome.browserAction.setPopup({
popup: selectedValue == 'op1' ? 'popup.html' : 'popup2.html'
});
});