下拉值在Chrome中刷新后会发生变化,但在Firefox中不会更改
dropdown value changes after refresh in Chrome but not in Firefox
我正在使用本地存储来存储员工的活动日志。他们从下拉框中选择他们的活动,他们选择的活动在 Firefox 中刷新后保留在下拉框中,但在 Google Chrome 中恢复为默认值。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">  David</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>
该问题与本地存储无关,而是在软刷新页面时 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>
相关文章:
- 制作一个不带HTML a标记但在动画播放完毕后指向其他页面的超链接
- jquery代码在Mozilla中有效,但在其他浏览器上无效
- delete在Object上效率低下,但在DOM Element's的数据属性,与null out相比
- 如何将字符串拆分为字符,但在javascript中保留空格
- 每个选择器的Jquery css颜色都在变化,但字体大小却没有变化
- JavaScript获胜't运行,但在jsFiddle中工作
- 列表样式在IE中未设置为none,但在IE中适用
- 预期响应包含一个对象,但在angular js中得到一个数组错误
- 滚动在Chrome中有效,但在Firefox或IE中无效
- jQuery自动完成在Firefox中运行良好,但在Chrome中则不然
- Javascript的某些部分在Chrome中不起作用,但在其他浏览器中可以完美工作
- appendChild在函数外部工作,但在函数内部不工作
- 像createComment这样的各种自定义变量名在内联javascript中被覆盖,但在外部js中没有.为什么?
- 如何获得Bootstrap Datepicker的年和月,因为它在变化
- 为什么这个jQuery可以作为一个小提琴工作,但在我的网页上没有
- 在js中访问元素时不透明度和样式未定义,但在css中定义
- JQuery和Javascript没有'在我的项目中不起作用,但在网络上起作用
- 下拉值在Chrome中刷新后会发生变化,但在Firefox中不会更改
- 主页链接'的背景颜色在Internet explorer中发生了变化,但在Mozilla Firefox中不起作
- 如果变量在settimeout之后但在它真正运行之前发生了变化怎么办?