用JavaScript在下拉列表

问题描述：

保持选定值我有以下的下拉列表：用JavaScript在下拉列表

Gender<select name="gender" id="gender"> 
    <option value=" "> EMPTY </option> 
    <option value="Male">Male</option> 
    <option value="Female">Female</option> 
</select>

如果让我选择的一个选项，它应该保持选为即使我更新页面的主要选项。例如，如果我选择“男性”，则下拉列表应将“男性”保留为选定的选项，并且只有当我用鼠标点击它时才会更改。如何在JavaScript中做到这一点？

你的意思是，当你刷新？这里是否包含任何服务器端语言？ – Ryan 2013-02-28 15:50:45

localStorage（或dataStorage，如果是旧的IE）或作为最后的资源cookies（除非你想在服务器端存储用户偏好）（阅读[this]（http://*.com/questions/6534535/best-way-to- store-small-ui-user-preferences-in-web-app）） – 2013-02-28 15:51:35

是的，当我刷新页面。我也使用PHP也 – 33528 2013-02-28 15:53:55

答

下面是使用localStorage的javascript/jquery方法。如果你打算在很多地方做到这一点，可能有方法来优化这段代码。

$(function() { 
    var genderValue = localStorage.getItem("genderValue"); 
    if(genderValue != null) { 
     $("select[name=gender]").val(genderValue); 
    } 

    $("select[name=gender]").on("change", function() { 
     localStorage.setItem("genderValue", $(this).val()); 
    }); 
})

答

HTML页面是无状态的 - 意思是他们不记得状态。为了完成你描述的内容，我们通常会根据之前提交的表单的值，输出不同的HTML。

对于使用URL哈希的方法，只有JavaScript方法，但是无论如何，您都需要一些服务器端代码来运行您的网站。

答

怎么样，如果你想保留的价值，当你通过它的编辑按钮继任页面导航回到这个页面。这是我的文章： Retain dynamically created DropDown list's selected value on event window.history.back()- JavaScript

用JavaScript在下拉列表

相关推荐