jQuery 检索和设置 html 选择元素的选定选项值

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/1221957/
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

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-26 10:57:02  来源:igfitidea点击:

jQuery to retrieve and set selected option value of html select element

jquery

提问by ErnieStings

I am attempting to retrieve and set the selected value of a select element (drop down list) with jQuery.

我正在尝试使用 jQuery 检索和设置选择元素(下拉列表)的选定值。

for retrievel i have tried $("#myId").find(':selected').val(), as well as $("#myId").val()but both return undefined.

对于我尝试过的检索$("#myId").find(':selected').val(),以及$("#myId").val()但都返回未定义。

Any insight into this problem would be much appreciated.

对这个问题的任何见解将不胜感激。

回答by pmko

to get/set the actual selectedIndex property of the select element use:

要获取/设置 select 元素的实际 selectedIndex 属性,请使用:

$("#select-id").prop("selectedIndex");

$("#select-id").prop("selectedIndex",1);

回答by redsquare

The way you have it is correct at the moment. Either the id of the select is not what you say or you have some issues in the dom.

目前你拥有它的方式是正确的。要么选择的 id 不是你所说的,要么你在 dom 中有一些问题。

Check the Id of the element and also check your markup validates at hereat W3c.

检查元素的 ID,并在 W3c此处检查您的标记是否有效。

Without a valid dom jQuery cannot work correctly with the selectors.

没有有效的 dom jQuery 无法与选择器一起正常工作。

If the id's are correct and your dom validates then the following applies:

如果 id 正确并且您的 dom 已验证,则以下适用:

To Read Select Option Value

读取选择选项值

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

To Set Select Option Value

设置选择选项值

$('#selectId').val('newValue');

To Read Selected Text

阅读所选文本

$('#selectId>option:selected').text();

回答by karim79

$('#myId').val()should do it, failing that I would try:

$('#myId').val()应该这样做,否则我会尝试:

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

回答by Jasper Giscombe

When setting with JQM, don't forget to update the UI:

设置时JQM,不要忘记更新UI

$('#selectId').val('newValue').selectmenu('refresh', true);

回答by Rigobert Song

$("#myId").val()should work if myidis the select element id!

$("#myId").val()如果myid是选择元素 id应该可以工作!

This would set the selected item: $("#myId").val('VALUE');

这将设置所选项目: $("#myId").val('VALUE');

回答by JaySing

Suppose you have created a Drop Down list using SELECT tag like as follows,

假设您已经使用 SELECT 标签创建了一个下拉列表,如下所示,

<select id="Country">

Now if you want to see what is the selected value from drop down using JQuery then, simply put following line to retrieve that value..

现在,如果您想查看使用 JQuery 从下拉列表中选择的值是什么,只需输入以下行即可检索该值。

var result= $("#Country option:selected").text();

it will work fine.

它会正常工作。

回答by Darkloki

I know this is old but I just had a bear of a time with Razor, could not get it to work no matter how hard I tried. Kept coming back as "undefined" no matter if I used "text" or "html" for attribute. Finally I added "data-value" attribute to the option and it read that just fine.

我知道这已经过时了,但我只是对 Razor 有一段时间的忍受,无论我多么努力都无法让它工作。无论我使用“text”还是“html”作为属性,都保持返回“未定义”。最后,我在选项中添加了“数据值”属性,它读取得很好。

 <option value="1" data-value="MyText">MyText</option>

 var DisplayText = $(this).find("option:selected").attr("data-value");

回答by Wikum W

$( "#myId option:selected" ).text(); will give you the text that you selected in the drop down element. either way you can change it to .val(); to get the value of it . check the below coding

$( "#myId option:selected" ).text(); 将为您提供您在下拉元素中选择的文本。无论哪种方式,您都可以将其更改为 .val(); 去获取它的价值。检查下面的编码

<select id="myId">
    <option value="1">Mr</option>
    <option value="2">Mrs</option>
    <option value="3">Ms</option>`
    <option value="4">Dr</option>
    <option value="5">Prof</option>
</select>

回答by Syed Nazir Hussain

Try this

尝试这个

$('#your_select_element_id').val('your_value').attr().add('selected');