使用 jQuery 在选择列表上设置 selected 属性
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/1311287/
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
Setting the selected attribute on a select list using jQuery
提问by Rupert
I have the following HTML:
我有以下 HTML：
<select id="dropdown">
<option>A</option>
<option>B</option>
<option>C</option>
</select>
I have the string "B" so I want to set the selectedattribute on it so it will be:
我有字符串“B”，所以我想selected在它上面设置属性，所以它是：
<select id="dropdown">
<option>A</option>
<option selected="selected">B</option>
<option>C</option>
</select>
How would I do this in jQuery?
我将如何在 jQuery 中做到这一点？
回答by Sampson
If you don't mind modifying your HTML a little to include the valueattribute of the options, you can significantly reduce the code necessary to do this:
如果您不介意稍微修改 HTML 以包含value选项的属性，则可以显着减少执行此操作所需的代码：
<option>B</option>
to
到
<option value="B">B</option>
This will be helpful when you want to do something like:
当您想要执行以下操作时，这将很有帮助：
<option value="IL">Illinois</option>
With that, the follow jQuery will make the change:
有了这个，下面的 jQuery 将做出改变：
$("select option[value='B']").attr("selected","selected");
If you decide notto include the use of the valueattribute, you will be required to cycle through each option, and manually check its value:
如果您决定不包括该value属性的使用，您将需要循环浏览每个选项，并手动检查其值：
$("select option").each(function(){
if ($(this).text() == "B")
$(this).attr("selected","selected");
});
回答by Darren Rose
<select id="cars">
<option value='volvo'>volvo</option>
<option value='bmw'>bmw</option>
<option value='fiat'>fiat</option>
</select>
var make = "fiat";
$("#cars option[value='" + make + "']").attr("selected","selected");
回答by G.Busato
If you are using JQuery, since the 1.6 you have to use the .prop() method :
如果您使用的是 JQuery，从 1.6 开始，您必须使用 .prop() 方法：
$('select option:nth(1)').prop("selected","selected");
回答by tvanfosson
I'd iterate through the options, comparing the text to what I want to be selected, then set the selected attribute on that option. Once you find the correct one, terminate the iteration (unless you have a multiselect).
我会遍历选项，将文本与我想要选择的内容进行比较，然后在该选项上设置 selected 属性。一旦找到正确的，就终止迭代（除非你有一个多选）。
$('#dropdown').find('option').each( function() {
var $this = $(this);
if ($this.text() == 'B') {
$this.attr('selected','selected');
return false;
}
});
回答by Derek Veit
You can follow the .selectedIndex strategy of danielrmt, but determine the index based on the text within the option tags like this:
您可以遵循 danielrmt 的 .selectedIndex 策略，但根据选项标签中的文本确定索引，如下所示：
$('#dropdown')[0].selectedIndex = $('#dropdown option').toArray().map(jQuery.text).indexOf('B');
This works on the original HTML without using value attributes.
这适用于原始 HTML，不使用值属性。
回答by Regan
This can be a solution
这可以是一个解决方案
$(document).on('change', 'select', function () {
var value = $(this).val();
$(this).find('option[value="' + value + '"]').attr("selected", "selected");
})
回答by Mikulasche
$('#select_id option:eq(0)').prop('selected', 'selected');
its good
很好
回答by Joe Chung
Code:
代码：
var select = function(dropdown, selectedValue) {
var options = $(dropdown).find("option");
var matches = $.grep(options,
function(n) { return $(n).text() == selectedValue; });
$(matches).attr("selected", "selected");
};
Example:
例子：
select("#dropdown", "B");
回答by Joe Chung
You can use pure DOM. See http://www.w3schools.com/htmldom/prop_select_selectedindex.asp
您可以使用纯 DOM。见http://www.w3schools.com/htmldom/prop_select_selectedindex.asp
document.getElementById('dropdown').selectedIndex = 1;
but jQuery can help:
但 jQuery 可以提供帮助：
$('#dropdown').selectedIndex = 1;
回答by David
Something along the lines of...
类似的东西...
$('select option:nth(1)').attr("selected","selected");
