選項：第一個孩子在所有情況下都沒有選擇相同

Question

爲什麼select中有optgroups時不工作？

不起作用

$("option:first-child").attr("selected", "selected"); 

工作

$("select>option:first-child").attr("selected", "selected"); 

當我做$("select:eq(1) option:first-child").val()這似乎是獲得正確的option，但是當我打電話attr()它沒有選擇正確的一個。

例子：http://jsfiddle.net/7J2Yb/

Answer 1

如果檢查$("option:first-child").length的價值，你會發現，它是5。 :first-child是選擇是它們的父的第一個子選項，它們是：

<SELECT id='a'> 
    <OPTION selected value=0>(all)</OPTION><!-- THIS ONE --> 
    <OPTION value=1>A</OPTION> 
    <OPTION value=2>B</OPTION> 
    <OPTION value=3>C</OPTION> 
</SELECT> 

<SELECT id='b'>  
    <OPTION selected value=0>(all)</OPTION><!-- THIS ONE --> 
    <optgroup label="A"> 
     <OPTION value=1>A</OPTION><!-- THIS ONE --> 
    </optgroup> 
    <optgroup label="B"> 
     <OPTION value=2>B</OPTION><!-- THIS ONE --> 
    </optgroup> 
    <optgroup label="C"> 
     <OPTION value=3>C</OPTION><!-- THIS ONE --> 
    </optgroup> 
</SELECT> 

此外$("select:eq(1) option:first-child").length等於4用於上述相同的理由。在數組上調用.val()會輸出第一個元素值，但是選擇器正在選擇它們的全部4個。

---

如果你想在每select寫入選擇的第一要素：

$("select").find("option:first").attr("selected", true); 

工作示例：http://jsfiddle.net/hunter/7J2Yb/2/