在Chrome中刷新后下拉值更改，但未在Firefox中更改

Question

我正在使用本地存储器查看我的员工的活动日志。他们从下拉框中选择他们的活动，他们选择的活动在Firefox中刷新后保留在下拉框中，但在谷歌浏览器中恢复默认设置。 Chrome中是否存在需要更改的设置才能保留选定的活动？这是我的一位员工的代码。

<script> 
function foo1(a) { 
//alert(a.value); 
var d = new Date(); 
var c = document.getElementById("time1").innerHTML; 
c = c + a.value + " was selected at: " + d.toString(); 
document.getElementById("time1").innerHTML = c + '<br/>'; 
localStorage.setItem(a.value, d.toString()); 
} 

function load1() { 
var c = "Wholesale Pictures.: " + localStorage.getItem("Wholesale Pictures.") + 

'<br/>'; 
c += "NS Pictures.:" + localStorage.getItem("NS Pictures.") + '<br/>'; 
c += "NS ERO's.:" + localStorage.getItem("NS ERO's.") + '<br/>'; 
c += "BL ERO's.:" + localStorage.getItem("BL ERO's.") + '<br/>'; 
c += "Wholesale Staging.:" + localStorage.getItem("Wholesale Staging.") + '<br/>'; 
c += "Wholesale Scan.:" + localStorage.getItem("Wholesale Scan.") + '<br/>'; 
c += "Sirius Tags.:" + localStorage.getItem("Sirius Tags.") + '<br/>'; 
c += "Lunch Break.:" + localStorage.getItem("Lunch Break.") + '<br/>'; 
document.getElementById("log1").innerHTML = c; 
} 
</script> 

<div class="david"> 
<h2><img src="Images/david.jpg" class="img-circle">&nbsp&nbspDavid</h2> 
<p id="log1"></p> 

<select id="options" class="form-control" onchange="foo1(this)"> 
<option>Select Work Area</option> 
<option>NS Pictures.</option> 
<option>NS ERO's.</option> 
<option>BL ERO's.</option> 
<option>Wholesale Staging.</option> 
<option>Wholesale Scan.</option> 
<option>Wholesale Pictures.</option> 
<option>Sirius Tags.</option> 
<option>Lunch Break.</option> 
</select> 

<div class="buttons"> 
<button id="log1" onclick="load1()">Activity Log</button> 
</div> 
<p id="time1"><br/></p> 
</div> 

Answer 1

该问题与本地存储无关，而是在软刷新页面时chrome和firefox处理窗体值的方式不同。 Firefox足够好记住表单的最后一个值，而且chrome不是。代码中没有任何内容试图将页面加载时的下拉菜单设置为最后选定的值。你将不得不在你的代码中添加一些东西来做到这一点。你可以存储上一次选择的值到本地存储，然后检索它在页面加载，这样的：

foo1(a) { 
//your code... 
localStorage.setItem('lastViewed',a.value); 
} 

，然后在你的页面

<script> 
var value=localStorage.getItem('lastViewed'); 
if (typeof value === "string") 
{ 
    document.getElementById('options').value=value; 
} 
</script>