JQuery 获取选择的选项值(不是文本，而是属性‘ value’)

04/2020: 更正旧答案

对选定的选项使用 翻译: 木头人精选伪选择器，然后使用 。瓦尔函数获取该选项的值。

$('select[name=selector] option').filter(':selected').val()

旁注 : 在第一个查询中使用 filter 比直接使用 :selected选择器更好。

如果在更改处理程序中，您可以简单地使用 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>

老答案:

编辑: 正如许多人指出的，这不返回选择的选项值。

~ ~ 使用 < strong > . val 获取所选选项的值,

$('select[name=selector]').val()~~

您需要在您的选择中添加一个 id，然后:
$('#selectorID').val()

$('select').change(function() {
console.log($(this).val())
});​

JsFiddle 例子

.val()将得到该值。

您可以按照以下步骤使用 jquery

剧本

  $('#IDOfyourdropdown').change(function(){
alert($(this).val());
});

小提琴是 给你

看看这个例子:

    <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>

我只是想分享我的经历

对我来说,

$('#selectorId').val()

返回空。

我不得不用

$('#selectorId option:selected').val()

对于这样的选择

<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>

你可以通过这种方式得到身份证:

$('#list-name option:selected').attr('id');

或者你可以用价值代替，用简单的方法得到它..。

<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>

像这样:

$('#list-name').val();

我的一个选项没有值: <option>-----</option>。我试图使用 if (!$(this).val()) { .. }，但我得到了奇怪的结果。结果表明，如果在 <option>元素上没有 value属性，它将返回其中的文本，而不是空字符串。如果您不希望 val()为您的选项返回任何内容，请确保添加 value=""。

试试这个:

$(document).ready(function(){
var data= $('select').find('option:selected').val();
});

或者

var data= $('select').find('option:selected').text();

$('#selectorID').val();

或者

$('select[name=selector]').val();

或者

$('.class_nam').val();

这个代码对我非常有用: 这将返回所选选项的值。 $(’# select _ id’) . find (‘ option: select’) . val () ;

 $(document ).ready(function() {
$('select[name=selectorname]').change(function() {
alert($(this).val());});
});

来源 林克

对 走开选择的值使用 jQueryVal ()，对 GET 选项文本使用 Text ()。

    <select id="myDropDown" class="form-control">
<option value="0">Select Value 0</option>
<option value="8">Option value 8</option>
<option value="5">Option value 5</option>
<option value="4">Option value 4</option>
</select>

在选择下拉菜单上更改事件

        $("#myDropDown").change(function () {


// Fetching Value
console.log($(this).val());


// Fetching Text
console.log($(this).find('option:selected').text());


alert('Value: '+$(this).val()+' | Text: '+$(this).find('option:selected').text());
});

点击按钮

        $("button").click(function () {


// Fetching Value
console.log($("#myDropDown").val());


// Fetching Text
console.log($('#myDropDown option:selected').text());


alert('Value: '+$("#myDropDown").val()+' | Text: '+$('#myDropDown option:selected').text());
});

效果更好，试试看。

let value = $("select#yourId option").filter(":selected").val();