通常我使用$(“#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>
只有一种正确的方法来查找所选的选项-按选项值属性。就拿这段简单的代码来说:
//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的结果
所以使用值属性选择器,不要忘记为所有选项设置值属性!
读取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();