jQuery 将选项值设置为选定的
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/38497852/
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
Set an option value as selected
提问by c.k
I would like to load a select box where in the user's selected value will automatically appear.
我想加载一个选择框，其中用户选择的值将自动出现。
I am receiving a Json data from the server with the user info.
sample of data is: {"color":"red"}
我正在从服务器接收带有用户信息的 Json 数据。数据样本是：{"color":"red"}
In my html code I have select option like this:
在我的 html 代码中，我有这样的选择选项：
<select id="input_user" class="selectinput" disabled="true">
<option value="n/a"> n/a </option>
<option value="red"> red </option>
<option value="green"> green </option>
<option value="yellow"> yellow </option>
<option value="blue"> blue </option>
<option value="white"> white </option>
</select> //this will only show "n/a" as default
I tried this code to make the red value as default but not working.
我尝试使用此代码将红色值设为默认值但不起作用。
var user_color= data[2].color; // this was from the json data
document.getElementById('input_user').selectedIndex = user_color;
Any help?
有什么帮助吗？
回答by Rory McCrossan
As you've tagged this question with jQuery you can just set the val()on the selectdirectly:
正如您所标记的这个问题与jQuery你可以设置val()在上select直接：
var user_color = 'red'; //data[2].color;
$('#input_user').val(user_color);<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="input_user" class="selectinput" disabled="true">
<option value="n/a">n/a</option>
<option value="red">red</option>
<option value="green">green</option>
<option value="yellow">yellow</option>
<option value="blue">blue</option>
<option value="white">white</option>
</select>回答by SNS - Web et Informatique
after much research, I finally went back to see the jQuery documentation that gave me the right answer :
经过大量研究，我终于回去查看给我正确答案的 jQuery 文档：
1 / Delete all the attributes of tags that are already with the 'selected' attribute
1 / 删除已经有'selected'属性的标签的所有属性
function remove_selected(){
$("select option").removeAttr('selected');
}
2 / I use the prop() function of jQuery to assign the 'selected' attribute to the desired tag
2 / 我使用 jQuery 的 prop() 函数将 'selected' 属性分配给所需的标签
// USE THE FUNCTION TO REMOVE ALL ATTRIBUTES ALREADY SELECTED
remove_selected();
// Set the tag <option> attribute to 'selected'
$('select option[value="ThatYouWant"]').prop({defaultSelected: true});
In HTML this gives :
在 HTML 中，这给出了：
<select>
<option value="something">Something</option>
<option value="ThatYouWant" selected>That you want</option>
<option value="OtherValue">Other value</option>
</select>
It is clean and without burrs, thank you for your feedback and corrections, approve if you find this solution correct. Sincerely, Raf.
它干净无毛刺，感谢您的反馈和更正，如果您认为此解决方案正确，请批准。真诚的，拉夫。
Source : https://api.jquery.com/prop/
