Question

<form>
    <select name='myfield' onchange='this.form.submit()'>
      <option>Milk</option>
      <option>Coffee</option>
      <option>Tea</option>
   </select>
    <noscript><input type="submit" value="Submit"></noscript>
</form>

如何在重新加载后设置所选选项..或提交？因为在提交之后它会回到默认状态......所以我想要的是即使提交或重新加载也会被选中...提前感谢.. ^ _ ^

Answer 1

获取选择：

var select=document.getElementsByTagName("select")[0];

然后，无论何时更改，都要存储其值：

select.addEventListener("change",function(){
  localStorage.setItem("select",select.selectedIndex);
});

然后你只需要在页面加载时重新设置它：

var before=localStorage.getItem("select");
if(before){
  select.options[+before].selected=true;
}

总数：

window.addEventListener("DOMContentLoaded",function(){
  var select=document.getElementsByTagName("select")[0];

  var before=localStorage.getItem("select");
  if(before){
    select.options[+before].selected=true;
  }

  select.addEventListener("change",function(){
    localStorage.setItem("select",select.selectedIndex);
  });
});

In action

Answer 2

本地存储是一种存储，您可以在浏览器中本地保存数据。即使您重新加载页面，数据存储仍然没有过期。

   <select name='myfield' id="selectOptions" onchange='this.form.submit()'>
       <option>Milk</option>
       <option>Coffee</option>
       <option>Tea</option>
   </select> 

   document.getElementById("selectOptions").onchange = function() {
        localStorage.setItem('selectedData', document.getElementById("selectOptions").value);
    }

   var storedData = localStorage.getItem('selectedData');

通过这种方式，您可以将所需数据存储在本地存储中。有关本地存储的详细信息，您可以查看this链接。

重新加载后选择Box ..

2 个答案: