jQuery 获取选定的选项值（不是文本，而是属性“值”）
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/13089944/
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
jQuery get selected option value (not the text, but the attribute 'value')
提问by n00b
Okay, I have this code:
好的，我有这个代码：
<select name="selector" id="selector">
<option value="1">Option 1</option>
<option value="2">Option 2</option>
</select>
And I'd like to get the value of the option selected. Example: 'Option 2' is selected, and the value of it is '2'. The '2' is the value I need to get and not 'Option 2'.
我想获得所选选项的价值。示例：选择“选项2”，其值为“2”。“2”是我需要得到的值，而不是“选项 2”。
回答by Selvakumar Arumugam
04/2020: Corrected old answer
04/2020：更正旧答案
Use :selectedpsuedo selector on the selected options and then use the .valfunction to get the value of the option.
对选定的选项使用:selected伪选择器，然后使用.val函数获取选项的值。
$('select[name=selector] option').filter(':selected').val()
Side note: Using filter is better then using :selectedselector directly in the first query.
旁注：使用过滤器比:selected在第一个查询中直接使用选择器更好。
If inside a change handler, you could use simply this.valueto get the selected option value. See demo for more options.
如果在更改处理程序中，您可以简单this.value地使用来获取选定的选项值。有关更多选项，请参阅演示。
//ways to retrieve selected option and text outside handler
console.log('Selected option value ' + $('select option').filter(':selected').val());
console.log('Selected option value ' + $('select option').filter(':selected').text());
$('select').on('change', function () {
//ways to retrieve selected option and text outside handler
console.log('Changed option value ' + this.value);
console.log('Changed option text ' + $(this).find('option').filter(':selected').text());
});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<select>
<option value="1" selected>1 - Text</option>
<option value="2">2 - Text</option>
<option value="3">3 - Text</option>
<option value="4">4 - Text</option>
</select>Old answer:
旧答案：
Edit:As many pointed out, this does not returns the selected option value.
编辑：正如许多人指出的那样，这不会返回选定的选项值。
~~Use .valto get the value of the selected option. See below,
~~使用.val获取所选选项的值。见下文，
$('select[name=selector]').val()~~
回答by David Torres
I just wanted to share my experience
我只是想分享我的经验
For me,
为了我，
$('#selectorId').val()
$('#selectorId').val()
returned null.
返回空值。
I had to use
我不得不使用
$('#selectorId option:selected').val()
$('#selectorId option:selected').val()
回答by j08691
$('select').change(function() {
console.log($(this).val())
});?
.val()will get the value.
.val()将获得价值。
回答by Marcus
You need to add an id to your select. Then:$('#selectorID').val()
您需要在您的选择中添加一个 id。然后：$('#selectorID').val()
回答by Payal Mittal
Try this:
尝试这个：
$(document).ready(function(){
var data= $('select').find('option:selected').val();
});
or
或者
var data= $('select').find('option:selected').text();
回答by Usman
回答by Geziel Carvalho
For a select like this
对于这样的选择
<select class="btn btn-info pull-right" id="list-name" style="width: auto;">
<option id="0">CHOOSE AN OPTION</option>
<option id="127">John Doe</option>
<option id="129" selected>Jane Doe</option>
... you can get the id this way:
...您可以通过以下方式获取 id：
$('#list-name option:selected').attr('id');
Or you can use value instead, and get it the easy way...
或者您可以使用 value 代替，并以简单的方式获得它...
<select class="btn btn-info pull-right" id="list-name" style="width: auto;">
<option value="0">CHOOSE AN OPTION</option>
<option value="127">John Doe</option>
<option value="129" selected>Jane Doe</option>
like this:
像这样：
$('#list-name').val();
回答by Gavin
One of my options didn't have a value: <option>-----</option>. I was trying to use if (!$(this).val()) { .. }but I was getting strange results. Turns out if you don't have a valueattribute on your <option>element, it returns the text inside of it instead of an empty string. If you don't want val()to return anything for your option, make sure to add value="".
我的一个选项没有价值：<option>-----</option>. 我试图使用if (!$(this).val()) { .. }但我得到了奇怪的结果。事实证明，如果您value的<option>元素上没有属性，它会返回其中的文本而不是空字符串。如果您不想val()为您的选项返回任何内容，请确保添加value="".
回答by Gavin
Look at the example:
看例子：
<select class="element select small" id="account_name" name="account_name">
<option value="" selected="selected">Please Select</option>
<option value="paypal" >Paypal</option>
<option value="webmoney" >Webmoney</option>
</select>
<script type="text/javascript">
$(document).ready(function(){
$('#account_name').change(function(){
alert($(this).val());
});
});
</script>
回答by Saddam Khan
$('#selectorID').val();
OR
或者
$('select[name=selector]').val();
OR
或者
$('.class_nam').val();
