Javascript 页面刷新后保留下拉列表的选定值

Javascript 页面刷新后保留下拉列表的选定值,javascript,html,refresh,browser-refresh,Javascript,Html,Refresh,Browser Refresh,我有一个按钮,可以根据几个下拉值中的选择筛选列表。但是,我遇到了一个问题,即单击按钮后,页面将刷新,下拉值将重置为默认值。如何确保刷新后,所选值保留在下拉列表中 <div><select> <option value="volvo">Volvo</option> <option value="saab">Saab</option> <option value="mercedes">Mercedes&l

我有一个按钮,可以根据几个下拉值中的选择筛选列表。但是,我遇到了一个问题,即单击按钮后,页面将刷新,下拉值将重置为默认值。如何确保刷新后,所选值保留在下拉列表中

<div><select>
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
  </select>

   <select>
    <option value="ford">ford</option>
    <option value="chevy">Chevy</option>
    <option value="ram">Ram</option>
    <option value="jeep">Jeep</option>
   </select>

   <button id="button" onclick="filterMyList()">Filter</button>
  </div>

沃尔沃汽车
萨博
梅赛德斯
奥迪
河流浅水处
雪佛兰
内存
吉普车
滤器

对如何处理这一问题有何建议?谢谢。

您可以使用HTML5本地存储api()

您的案例示例:

$(document).ready(function() {
    // On refresh check if there are values selected
    if (localStorage.selectVal) {
            // Select the value stored
        $('select').val( localStorage.selectVal );
    }
});

// On change store the value
$('select').on('change', function(){
    var currentVal = $(this).val();
    localStorage.setItem('selectVal', currentVal );
});

希望这有帮助。请随时通知我。

您可以使用Cookie或html5本地存储API。创建页面的脚本可以将所选的
属性添加到它使用的选项中。您能给我看一下您尝试过的代码吗?这样我就可以知道它为什么会适得其反了。您能回答这个问题吗:工作正常,谢谢。而且,我不知道本地存储。。。非常有趣!安德烈·卡西奥