使用jQuery選擇多個單選按鈕組的第一個單選按鈕

Question

我想自動選擇多個單選按鈕組的第一個單選按鈕。

<div class="element"> 
<input type="radio" name="group1" value="1"> 
<input type="radio" name="group1" value="2"> 
<input type="radio" name="group1" value="3"> 
</div> 

<div class="element"> 
<input type="radio" name="group2" value="1"> 
<input type="radio" name="group2" value="2"> 
<input type="radio" name="group2" value="3"> 
</div> 

這裏的東西，而這個工程：

$('.element').each(function(){ 
    $(this).find('input[type=radio]:first').attr('checked', true); 
}); 

我想不通爲什麼我不能使它工作使用：使用each（）方法第一選擇

下面的代碼不起作用：它只選擇第一個div中的第一個單選按鈕，你能告訴我爲什麼嗎？

$('.element input[type=radio]:first').each(function(){ 
    $(this).attr('checked', true); 
}); 

由於

Answer 1

第一選擇循環遍歷每個.element。第二個選擇器循環遍歷每個僅由一個元素組成的element input[type=radio]:first。

我翻譯你的代碼人類可讀的序列：

1. 選擇.element
   通過每.element
   查找無線電輸入元素
   設置checked=true第一次出現。
2. 選擇.element的孩子的第一個無線電輸入元素。
   循環通過與選擇器匹配的每個元素（只有一個）
   設置checked=true。

---

替代方式：

//Alternative method 
$('element').each(function(){ 
    $('input[type=radio]', this).get(0).checked = true; 
}); 

//Another method 
$('element').each(function(){ 
    $('input[type=radio]:first', this).attr('checked', true); 
}); 

Answer 2

嘗試使用第n個孩子：

$('.element').each(function(){ 
    $(this).find('input[type=radio]:nth-child(1)').attr('checked', true); 
}); 

Answer 3

最簡單的方法是使用:first-child選擇。相對於:first，只返回第一個匹配的元素，:first-child將返回這是它的父元素的第一個孩子的任何元素：

//returns the first radio button in group1, and the first one in group2 as well. 
$('.element input[type=radio]:first-child'); 

見羅布·W公司的答案的解釋，爲什麼你的代碼ISN」不工作。