通常我使用$(“#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>
当前回答
对于下拉选项，你可能想要这样的东西:
对于选定的文本
var conceptName = $('#aioConceptName').find(":selected").text();
对于所选值
var conceptName = $('#aioConceptName').find(":selected").val();
val()没有做到这一点的原因是，单击一个选项并不会改变下拉列表的值——它只是将:selected属性添加到作为下拉列表子项的selected选项中。
其他回答
对于下拉选项，你可能想要这样的东西:
对于选定的文本
var conceptName = $('#aioConceptName').find(":selected").text();
对于所选值
var conceptName = $('#aioConceptName').find(":selected").val();
val()没有做到这一点的原因是，单击一个选项并不会改变下拉列表的值——它只是将:selected属性添加到作为下拉列表子项的selected选项中。
试试这段代码::)
得到的值:
$("#Ostans option:selected").val() + '.' + $("#shahrha option:selected").val()
得到文本:
$("#Ostans option:selected").text() + '.' + $("#shahrha option:selected").text()
你可以试试这个:
var ioConceptName = $('#ioConceptName option:selected').text();
我无意中发现了这个问题，并将埃利奥特·博纳维尔的答案简化为:
var conceptName = $('#aioConceptName :selected').text();
或一般:
$('#id :pseudoclass')
这节省了额外的jQuery调用，在一个镜头中选择所有内容，并且更加清晰(我的观点)。
只有一种正确的方法来查找所选的选项-按选项值属性。就拿这段简单的代码来说:
//find selected option
$select = $("#mySelect");
$selectedOption = $select.find( "option[value=" + $select.val() + "]" );
//get selected option text
console.log( $selectedOption.text() );
如果你有一个这样的列表:
<select id="#mySelect" >
<option value="value1" >First option</option>
<option value="value2" >Second option</option>
<option value="value3" selected >Third option</option>
</select>
如果您使用所选属性作为选项，那么find(“:selected”)将给出不正确的结果，因为所选属性将永远停留在选项中，即使用户选择了另一个选项。
即使用户选择第一个或第二个选项，$("select option:selected")的结果也会给出两个元素!因此$("select:selected").text()会给出类似First option Third option的结果
所以使用值属性选择器，不要忘记为所有选项设置值属性!
