jQuery:如何检查是否在选择框中明确选择了NO选项

Question

是否可以检测在选择框中是否未明确选择任何选项？

我尝试过这些方法,但没有一种方法可行:

<select id="mySelect">
  <option value="1">First</option>
  <option value="2">Second</option>
  <option value="3">Third</option>
  <option value="4">Fourth</option>
</select>

试验1:

alert($('#select option:selected').length); // returns 1

试验2:

alert($('#select option[selected=selected]').length); // returns 1

试验3:

alert($('#select option:selected').attr('selected')); // returns 'selected'

任何想法SO人？

Answer 1

试试这个:

<select id="mySelect">
  <option value="1">First</option>
  <option value="2">Second</option>
  <option value="3">Third</option>
  <option value="4">Fourth</option>
</select><input type="button" id="btncheck" value="check"/>

使用这个JS:

$('#btncheck').click(function(){
     if ($("#mySelect ")[0].selectedIndex <= 0) {
                alert("Not selected");
            }
    else
        alert("Selected");
});

它将检查您的下拉列表是否已被选中.

试试这个小提琴:http://jsfiddle.net/aPYyt/

希望它有所帮助!

PS:您必须将第一个值设为默认值.

Answer 2

这是普通选择元素的工作方式:如果没有其他选项具有selected属性集,则选择第一个选项.最简单的解决方法是添加一个空选项作为第一个选项,如下所示:

<select id="mySelect">
  <option value="">-- select an item --</option>
  <option value="1">First</option>
  <option value="2">Second</option>
  <option value="3">Third</option>
  <option value="4">Fourth</option>
</select>

在jQuery中,您可以测试以下条件之一:

$("#mySelect").val() === "";
$("#mySelect option:selected").index() == 0;
$("#mySelect option:first:selected").length != 0;