使用jQuery获取下拉菜单项的选定值

我怎样才能得到使用jQuery下拉框选定的值?
我试过使用

var value = $('#dropDownId').val(); 

 var value = $('select#dropDownId option:selected').val(); 

但都返回一个空string。

对于单选DOM元素,获取当前选定的值:

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

获取当前选中的文本:

 $('#dropDownId :selected').text(); 
 var value = $('#dropDownId:selected').text() 

应该工作正常,看到这个例子:

 $(document).ready(function(){ $('#button1').click(function(){ alert($('#combo :selected').text()); }); }); 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <select id="combo"> <option value="1">Test 1</option> <option value="2">Test 2</option> </select> <input id="button1" type="button" value="Click!" /> 

试试这个jQuery,

 $("#ddlid option:selected").text(); 

或者这个javascript,

  var selID=document.getElementById("ddlid"); var text=selID.options[selID.selectedIndex].text; 

如果您需要访问该值而不是文本,请尝试使用val()方法而不是text()

看看下面的小提琴链接。

Demo1 | DEMO2

尝试这个

 $("#yourDropdown option:selected").text(); 

我知道这是一个非常古老的post,我可能会因为这个可怜的复活而被鞭打,但我想我会分享一些非常有用的小JS片段,我用在我的兵工厂的每个应用程序…

如果input:

 $("#selector option:selected").val() // or $("#selector option:selected").text() 

正在变老,请尝试添加这些小文件到您的全局*.js文件中:

 function soval(a) { return $('option:selected', a).val(); } function sotext(a) { return $('option:selected', a).text(); } 

并只写soval("#selector"); 或者sotext("#selector"); 代替! 通过将两者结合起来并返回一个包含valuetext的对象,就可以获得更多!

 function so(a) { my.value = $('option:selected', a).val(); my.text = $('option:selected', a).text(); return my; } 

这节省了我大量宝贵的时间,特别是在重型应用程序上!

又一个testing的例子:

 <!DOCTYPE html> <html> <head> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"> </script> <script> $(document).ready(function(){ $('#bonus').change(function() { alert($("#bonus option:selected").text()); }); }); </script> </head> <body> <select id="bonus"> <option value="1">-$5000</option> <option value="2">-$2500</option> <option value="3">$0</option> <option value="4">$1</option> <option value="5">We really appreciate your work</option> </select> </body> </html> 

这将做的伎俩

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

这将提醒选定的值。 JQuery代码…

 $(document).ready(function () { $("#myDropDown").change(function (event) { alert("You have Selected :: "+$(this).val()); }); }); 

HTML代码…

 <select id="myDropDown"> <option>Milk</option> <option>Egg</option> <option>Bread</option> <option>Fruits</option> </select> 

你有没有提供你的select元素的ID?

 <select id='dropDownId'> ... 

你的第一个陈述应该工作!

试试这个,它得到的价值是:

$('select#myField').find('option:selected').val();

你的第一个声明应该工作!

 var value = $('#dropDownId').val(); 

它将返回当前选定元素的值。

html中的下拉控件生成的id将是dynamic的。 因此,使用完整的id $('ct100_<Your control id>').val(). 它会工作。

或者,如果你想尝试:

 $("#foo").find("select[name=bar]").val(); 

我今天用它,它工作正常。

使用

 $('#dropDownId').find('option:selected').val() 

这应该工作:)

要从下拉式获取jquery值,只需使用下面的函数发送id并获取选定的值:

 function getValue(id){ var value = ""; if($('#'+id)[0]!=undefined && $('#'+id)[0]!=null){ for(var i=0;i<$('#'+id)[0].length;i++){ if($('#'+id)[0][i].selected == true){ if(value != ""){ value = value + ", "; } value = value + $('#'+id)[0][i].innerText; } } } return value; } 

我知道这是旧的,但我虽然我更新与更新的答案

 $( document ).on( 'change', '#combo', function () { var prepMin= $("#combo option:selected").val(); alert(prepMin); }); 

我希望这有帮助

 $("select[id$=dropDownId]").val() 
  • 尝试这个

使用这些代码之一

 $('#dropDownId :selected').text(); 

要么

 $('#dropDownId').text(); 

这是什么工作

  var value= $('option:selected', $('#dropDownId')).val(); 

对于选定的文本使用:

 value: $('#dropDownId :selected').text(); 

对于选定的值使用:

 value: $('#dropDownId').val(); 

您可以使用以下任何一种:

 $(document).on('change', 'select#dropDownId', function(){ var value = $('select#dropDownId option:selected').text(); //OR var value = $(this).val(); }); 

只要使用这个

 $('#select_id:selected').text(); 
 $("#selector <b>></b> option:selected").val() 

要么

 $("#selector <b>></b> option:selected").text() 

上面的代码适合我

你需要像这样。

 $('[id$=dropDownId] option:selected').val(); 
  $("#dropDownId").val('2'); var SelectedValue= $("#dropDownId option:selected").text(); $(".ParentClass .select-value").html(SelectedValue); <p class="inline-large-label button-height ParentClass" > <label for="large-label-2" class="label">Country <span style="color: Red;">*</span><small></small></label> <asp:DropDownList runat="server" ID="dropDownId " CssClass="select" Width="200px"> </asp:DropDownList> </p> 

尝试这个:

  $('#dropDownId option').filter(':selected').text(); $('#dropDownId option').filter(':selected').val();