jQuery 从下拉列表中获取选定的选项

Question

通常我使用 $("#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>

原文由 William Kinaan 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

对于下拉选项，您可能需要这样的内容：

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

val() 不起作用的原因是因为单击选项不会更改下拉列表的值——它只是将 :selected 属性添加到作为下拉列表 子 项的选定选项中。

原文由 Elliot Bonneville 发布，翻译遵循 CC BY-SA 3.0 许可协议

Answer 2

为每个选项设置值

<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> 上设置 value 属性。

现在您可以调用 $('#aioConceptName').val() 而不是其他人建议的所有这些 :selected voodoo。

原文由 Jacob Valenta 发布，翻译遵循 CC BY-SA 4.0 许可协议