jQuery 使用选项值添加 'selected' 属性
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/7473835/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Add 'selected' attribute using the option value
提问by jQuerybeast
I have a select box with 10 options. Each time you select an option it sets in the localstorage the value you selected with id "select1".
我有一个带有 10 个选项的选择框。每次您选择一个选项时，它都会在 localstorage 中设置您选择的 ID 为“select1”的值。
For example: If you select the first option you get in the localstorage: Key: Emailclient - Value: Option1.
例如：如果您选择在 localstorage 中获得的第一个选项：Key: Emailclient - Value: Option1。
Now, Iom trying to make the value of the localstorage, the selected attribute in the select form.
现在，Iom 尝试使 localstorage 的值，select 表单中的 selected 属性。
This is what I tried but doesn't seem to work:
这是我尝试过但似乎不起作用的方法：
if (localStorage.getItem("Select1") == "Option1"){
$('#selectbox').val("Option1").attr("selected");
}
What I'm I doing wrong?
我做错了什么？
EDIT:
编辑：
This is my code:
这是我的代码：
<select id="selectbox" >
<option>Default</option>
<option>Option 1</option>
<option>Option 3</option>
<option>Option 3</option>
<option>Option 4</option>
<option>Option 5</option>
<option>Option 6</option>
</select>
Thanks
谢谢
回答by jQuerybeast
This works:
这有效：
var optionValue = localStorage.getItem("Select1")
$("#selectbox").val(optionValue)
.find("option[value=" + optionValue +"]").attr('selected', true);
回答by Hyman
I think you might be looking for something like this. http://jsfiddle.net/tnPU8/3/
我想你可能正在寻找这样的东西。 http://jsfiddle.net/tnPU8/3/
It loops through the options of the select box and compares their values with the values of b. If they are equal the index of the select box is changed so that the option that contains the value of bis displayed.
它遍历选择框的选项并将它们的值与 的值进行比较b。如果它们相等，则更改选择框的索引，以便b显示包含值的选项。
var b; //set equal to what you want to compare
$('#selectbox').find('option').each(function(i,e){
console.log($(e).val());
if($(e).val() == b){
$('#selectbox').prop('selectedIndex',i);
}
});
Edit: Using localStoragehttp://jsfiddle.net/tnPU8/7/
编辑：使用localStoragehttp://jsfiddle.net/tnPU8/7/
回答by bstakes
This is all you should need:
这是您应该需要的全部内容：
$("#selectbox").val(localStorage.getItem("selectbox"));
I've updated a previous fiddle for an example: http://jsfiddle.net/uY7ck/1/
我已经更新了以前的小提琴示例：http: //jsfiddle.net/uY7ck/1/
EDIT: In the code you posted originally, assuming you are setting localStorage with the same select box, you would be comparing "Option1" (no space) with "Option 1" (space). That comparison will never work, so the option would never be selected.
编辑：在您最初发布的代码中，假设您使用相同的选择框设置 localStorage，您将比较“Option1”（无空格）与“Option 1”（空格）。这种比较永远不会起作用，因此永远不会选择该选项。
回答by Korvin Szanto
回答by Kevin B
Try this:
尝试这个：
if (localStorage.getItem("Select1") == "Option1"){
$('#selectbox option:contains(Option1)').prop('selected',true); // jquery 1.6+
}
if you are using a version of jQuery older than 1.6, replace .propwith .attr
如果您使用的 jQuery 版本早于 1.6，请替换.prop为.attr
Edit: more dynamic version
编辑：更动态的版本
if (localStorage.getItem("Select1")) {
$('#selectbox option:contains(' + localStorage.getItem("Select1") + ')').prop('selected',true);
}
