通常我使用$(“#id”).val()来返回所选选项的值,但这一次它不起作用。 所选标记的id为aioConceptName

html代码

<label for="name">Name</label>
<input type="text" name="name" id="name" />

<label for="aioConceptName">AIO Concept Name</label>
<select id="aioConceptName">
    <option>choose io</option>
    <option>roma</option>
    <option>totti</option>
</select>

当前回答

如果你在事件上下文中,在jQuery中,你可以使用以下方法检索所选的选项元素: $(this).find('option:selected')如下所示:

$('dropdown_selector').change(function() {
    //Use $option (with the "$") to see that the variable is a jQuery object
    var $option = $(this).find('option:selected');
    //Added with the EDIT
    var value = $option.val();//to get content of "value" attrib
    var text = $option.text();//to get <option>Text</option> content
});

Edit

正如possession within所提到的,我的答案只是回答这个问题:如何选择所选的“选项”。

接下来,要获取选项值,使用option.val()。

其他回答

使用jQuery,只需添加一个更改事件,并在该处理程序中获得选定的值或文本。

如果您需要选定的文本,请使用以下代码:

$("#aioConceptName").change(function () {
    alert($("#aioConceptName :selected").text())
});

或者如果您需要选择的值,请使用以下代码:

$("#aioConceptName").change(function () {
    alert($("#aioConceptName :selected").attr('value'))
});

对于下拉选项,你可能想要这样的东西:

对于选定的文本

var conceptName = $('#aioConceptName').find(":selected").text();

对于所选值

var conceptName = $('#aioConceptName').find(":selected").val();

val()没有做到这一点的原因是,单击一个选项并不会改变下拉列表的值——它只是将:selected属性添加到作为下拉列表子项的selected选项中。

为每个选项设置值

<label for="aioConceptName">AIO Concept Name</label>
<select id="aioConceptName">
    <option value="0">choose io</option>
    <option value="1">roma</option>
    <option value="2">totti</option>
</select>

$('#aioConceptName').val()不起作用,因为.val()返回value属性。要使其正常工作,必须在每个<option>上设置值属性。

现在你可以调用$('#aioConceptName').val()而不是这一切:选择巫毒是由其他人建议。

我无意中发现了这个问题,并将埃利奥特·博纳维尔的答案简化为:

var conceptName = $('#aioConceptName :selected').text();

或一般:

$('#id :pseudoclass')

这节省了额外的jQuery调用,在一个镜头中选择所有内容,并且更加清晰(我的观点)。

读取select对象的值(而不是文本):

var status = $("#Status").val();
var status = $("#Status")[0].value;
var status = $('#Status option:selected').val();

如何禁用选择? 在这两个变量中,value可以使用以下命令更改:

A

用户无法与下拉菜单进行交互。他不知道还有什么其他选择。

$('#Status').prop('disabled', true);

B

用户可以在下拉菜单中看到选项,但所有选项都是禁用的:

$('#Status option').attr('disabled', true);

在这种情况下,$("#Status").val()只适用于小于1.9.0的jQuery版本。所有其他变体都可以工作。

如何更新一个禁用的选择?

从后面的代码中,您仍然可以更新您选择的值。仅对用户禁用:

$("#Status").val(2);

在某些情况下,你可能需要触发事件:

$("#Status").val(2).change();