使用jQuery从下拉列表(选择框)中获取选定的文本

JavaScript

老丝Jim猴子

2020-03-09

如何从jQuery 的下拉列表获取选定的文本(而不是选定的值)

第195篇《使用jQuery从下拉列表(选择框)中获取选定的文本》来自Winter(https://github.com/aiyld/aiyld.github.io)的站点

14个回答
GO凯 2020.03.09

For multi-selects:

$("#yourdropdownid :selected").map(function(i, v) { return $.trim($(v).text()); }
米亚Near 2020.03.09
$("#dropdown").find(":selected").text();


$("#dropdown :selected").text();

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

$("#dropdown").children(":selected").text();
逆天小胖Mandy 2020.03.09

Try:

$var = jQuery("#dropdownid option:selected").val();
   alert ($var);

Or to get the text of the option, use text():

$var = jQuery("#dropdownid option:selected").text();
   alert ($var);

More Info:

阿飞蛋蛋 2020.03.09
var e = document.getElementById("dropDownId");
var div = e.options[e.selectedIndex].text;
斯丁小宇宙 2020.03.09

Select Text and selected value on dropdown/select change event in jQuery

$("#yourdropdownid").change(function() {
    console.log($("option:selected", this).text()); //text
    console.log($(this).val()); //value
})
Near小哥Green 2020.03.09
 $("#selectID option:selected").text();

Instead of #selectID you can use any jQuery selector, like .selectClass using class.

As mentioned in the documentation here.

The :selected selector works for <option> elements. It does not work for checkboxes or radio inputs; use :checked for them.

.text() As per the documentation here.

Get the combined text contents of each element in the set of matched elements, including their descendants.

So you can take text from any HTML element using the .text() method.

Refer the documentation for a deeper explanation.

eva 2020.03.09
$("select[id=yourDropdownid] option:selected").text()

This works fine

Mandy番长 2020.03.09

Use this

const select = document.getElementById("yourSelectId");

const selectedIndex = select.selectedIndex;
const selectedValue = select.value;
const selectedText = select.options[selectedIndex].text;   

Then you get your selected value and text inside selectedValue and selectedText.

小小小胖 2020.03.09

Various ways

1. $("#myselect option:selected").text();

2. $("#myselect :selected").text();

3. $("#myselect").children(":selected").text();

4. $("#myselect").find(":selected").text();
小小MandyGil 2020.03.09

$("#DropDownID").val() will give the selected index value.

理查德村村小宇宙 2020.03.09

This works for me

$("#dropdownid").change(function() {
    alert($(this).find("option:selected").text());
});

If the element created dynamically

$(document).on("change", "#dropdownid", function() {
    alert($(this).find("option:selected").text());
});
逆天古一Mandy 2020.03.09

If you already have the dropdownlist available in a variable, this is what works for me:

$("option:selected", myVar).text()

The other answers on this question helped me, but ultimately the jQuery forum thread $(this + "option:selected").attr("rel") option selected is not working in IE helped the most.

Update: fixed the above link

马克 2020.03.09
$("option:selected", $("#TipoRecorde")).text()
梅Near米亚 2020.03.09
$("#yourdropdownid option:selected").text();

问题类别

JavaScript Ckeditor Python Webpack TypeScript Vue.js React.js ExpressJS KoaJS CSS Node.js HTML Django 单元测试 PHP Asp.net jQuery Bootstrap IOS Android