Javascript 如何使用 jQuery 选择下拉选项？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/4864620/
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
How to use jQuery to select a dropdown option?
提问by dotty
I was wondering if it's possible to get jQuery to select an <option>, say the 4th item, in a dropdown box?
我想知道是否有可能让 jQuery<option>在下拉框中选择第 4 个项目？
<select>
<option></option>
<option></option>
<option></option>
<option></option>
<option></option>
</select>
I want the user to click a link, then have the <select>box change its value, as if the user has selected it by clicking on the <option>.
我希望用户单击一个链接，然后让该<select>框更改其值，就好像用户通过单击<option>.
回答by Gabriele Petrioli
How about
怎么样
$('select>option:eq(3)').attr('selected', true);
example at http://www.jsfiddle.net/gaby/CWvwn/
示例在http://www.jsfiddle.net/gaby/CWvwn/
for modern versions of jquery you should use the .prop()instead of .attr()
对于现代版本的 jquery，您应该使用.prop()代替.attr()
$('select>option:eq(3)').prop('selected', true);
example at http://jsfiddle.net/gaby/CWvwn/1763/
回答by Harold Sota
The solution:
解决方案：
$("#element-id").val('the value of the option');
回答by Ja?ck
HTML select elements have a selectedIndexproperty that can be written to in order to select a particular option:
HTML select 元素有一个selectedIndex属性，可以写入该属性以选择特定选项：
$('select').prop('selectedIndex', 3); // select 4th option
Using plain JavaScript this can be achieved by:
使用纯 JavaScript 可以通过以下方式实现：
// use first select element
var el = document.getElementsByTagName('select')[0];
// assuming el is not null, select 4th option
el.selectedIndex = 3;
回答by franzisk
I would do it this way
我会这样做
$("#idElement").val('optionValue').trigger('change');
回答by Ionic? Biz?u
The easiest way is val(value)function:
最简单的方法是val(value)函数：
$('select').val(2);
And to get the selected value you give no arguments:
要获得选定的值，您无需提供任何参数：
$('select').val();
Also, you if you have <option value="valueToSelect">...</option>, you can do:
另外，如果你有<option value="valueToSelect">...</option>，你可以这样做：
$('select').val("valueToSelect");
回答by Victor
if your options have a value, you can do this:
如果您的选项有价值，您可以这样做：
$('select').val("the-value-of-the-option-you-want-to-select");
'select' would be the id of your select or a class selector. or if there is just one select, you can use the tag as it is in the example.
'select' 将是您选择的 ID 或类选择器。或者如果只有一个选择，您可以使用示例中的标签。
回答by nlareu
Use the following code if you want to select an option with a specific value:
如果要选择具有特定值的选项，请使用以下代码：
$('select>option[value="' + value + '"]').prop('selected', true);
回答by Mamun Rasid
Try with the below codes. All should work.
$('select').val(2);
$('select').prop('selectedIndex', 1);
$('select>option[value="5"]').prop('selected', true);
$('select>option:eq(3)').attr('selected', 'selected');
$("select option:contains(COMMERCIAL)").attr('selected', true);
回答by Lee D
I prefer nth-child() to eq() as it uses 1-based indexing rather than 0-based, which is slightly easier on my brain.
我更喜欢 nth-child() 而不是 eq() 因为它使用基于 1 的索引而不是基于 0 的索引，这对我的大脑来说稍微容易一些。
//selects the 2nd option
$('select>option:nth-child(2)').attr('selected', true);
回答by Savaratkar
With '' element usually we use 'value' attribute. It will make it easier to set then:
对于 '' 元素，我们通常使用 'value' 属性。这将使设置更容易：
$('select').val('option-value');
