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

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

GO凯2020/03/09 18:03:34

For multi-selects:

$("#yourdropdownid :selected").map(function(i, v) { return $.trim($(v).text()); }
米亚Near2020/03/09 18:03:34
$("#dropdown").find(":selected").text();


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

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

$("#dropdown").children(":selected").text();
逆天小胖Mandy2020/03/09 18:03:34

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 18:03:34
var e = document.getElementById("dropDownId");
var div = e.options[e.selectedIndex].text;
斯丁小宇宙2020/03/09 18:03:34

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小哥Green2020/03/09 18:03:33
 $("#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.

eva2020/03/09 18:03:33
$("select[id=yourDropdownid] option:selected").text()

This works fine

Mandy番长2020/03/09 18:03:33

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 18:03:33

Various ways

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

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

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

4. $("#myselect").find(":selected").text();
小小MandyGil2020/03/09 18:03:33

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

理查德村村小宇宙2020/03/09 18:03:33

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());
});
逆天古一Mandy2020/03/09 18:03:33

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 18:03:33
$("option:selected", $("#TipoRecorde")).text()
梅Near米亚2020/03/09 18:03:33
$("#yourdropdownid option:selected").text();