在页面刷新时恢复下拉选择的选项

Restore dropdown selected option on page refresh?

本文关键字：选择 选项 恢复 刷新      更新时间：2023-09-26

我有一个这样的表单，

<html>
<body>
<form>
<select name="alphabets" id="alphabets">
    <option value="A">A</option>
    <option value="B">B</option>
    <option value="C">C</option>
    <option value="D" selected="selected">D</option>
</select>
</form>
</body>
</html>

当我第一次拖动页面时，选项D被选中。如果我从下拉列表中选择选项A，然后进行页面刷新，我希望下拉选项返回到D。在页面刷新时，我希望所有内容都返回到其初始状态。但下拉列表显示选项A，或之前选择的任何选项。

知道如何在页面刷新时使页面显示选项D吗？

谢谢。

将以下内容放在页面上的脚本标记中。

 $(function(){
      $('#alphabets option[value="D"]').attr('selected', true);
 });

$(document).ready(function() {
    $("#alphabets").val(localStorage.alphabets);
});
$("#alphabets").change(function() {
    localStorage.alphabets = $(this).val();
});

我认为这会起作用（仅在支持localStorage的浏览器中），但我还没有测试过

这是Firefox记住选择列表中的选择的"功能"。

将autocomplete="off"添加到<select>标记中。

相关文章：