Question

我今天遇到这个问题，我希望我选择的选项是刷新页面时的默认值。例如，我有这个：

<select id="options">
<option value="0">Apple</option> 
<option value="1">Orange</option> 
<option value="2">Mango</option></select>

我的用户界面上的默认设置是Apple，所以我想要的是当我点击橙色选项时，它会在刷新页面时成为默认值。有没有办法做到这一点？感谢

Answer 1

我认为本地存储可以为您提供帮助。例如：

<select id="options">
<option value="0">Apple</option> 
<option value="1">Orange</option> 
<option value="2">Mango</option></select>

的Javascript

$("#options").on("change", function(){
    var val = $(this).val();
    // save to local
    if(window.localStorage){
        window.localStorage.setItem("#options-val", val);
    }
});

if(window.localStorage){
    var item = window.localStorage.getItem("#options-val");
    if(item) $("#options").val(item);
}

请参阅demo

所有js代码必须在$（document）.ready（）

中

在demo上运行代码后，尝试重新加载页面，您将看到结果！

Answer 2

使用onchange设置会话cookie，然后在页面加载时设置option.selected

<select id="options" onChange="document.cookie='fruit='+this.value;">
<option value="0">Apple</option> 
<option value="1">Orange</option> 
<option value="2">Mango</option></select>

<script type="text/javascript">
<!--
function getCookie(cname)
{
/* http://www.w3schools.com/js/js_cookies.asp */
var name = cname + "=";
var ca = document.cookie.split(';');
for(var i=0; i<ca.length; i++)
  {
  // var c = ca[i].trim(); // trim not supported on IE8
  var c = ca[i].replace(/^\s+|\s+$/gm,'');
  if (c.indexOf(name)==0) return c.substring(name.length,c.length);
  }
return "";
} 
window.onload = function() {
    var v = getCookie('fruit');
    if (v) document.getElementById('options').options[v].selected = true;
}
//-->
</script>

Answer 3

为您想要的选项设置selected =“selected”。

<option selected="selected">
  default
</option>

有没有办法让所选的选项在刷新时成为默认值？

3 个答案: