取消選中使用類

這裏的Javascript單選按鈕是我的2個收音機按鈕：取消選中使用類

<input type="radio" name="sex" id="Button1" class="Button"/> 

<input type="radio" name="sex" id="Button2" class="Button"/>

當我打電話說countains功能：

document.getElementById('Button2').checked = false;

它取消選中Button2的。但我想通過使用類

而當函數包含取消選中它：

document.getElementsByClassName('Button').checked = false;

它不取消選擇Button2的

爲什麼和如何解決？

謝謝。 :)

來源

2015-02-08 Boby

兩個按鈕具有相同的類名，你怎麼指望代碼工作？你必須給它一些東西來區分所需的按鈕。 – 2015-02-08 14:23:35

getElementsByClassName()返回集合（如陣列）。所以，你會真正要做的

document.getElementsByClassName('Button')[1].checked = false;

但是你不能確定你的Button2是第二個元素的數組中，如果你有Button類的更多元素。

來源

2015-02-08 14:24:28 prajmus

工作好:) – Boby 2015-02-08 15:15:57

getElementsByClassName返回一個節點列表（就像陣列）而不是元素。

如果你想要做的事，以在節點列表中的每一個元素，那麼你必須遍歷它，做在列表中每個項目的事情。

var node_list = document.getElementsByClassName('Button'); 
for (var i = 0; i < node_list.length; i++) { 
    node_list[i].checked = false; 
}

來源

2015-02-08 14:23:32 Quentin

document.getElementsByClassName返回類名的元素的節點列表（有點像這些元件的陣列）。所以你應該循環並改變每個元素的檢查狀態。

對於通用的方法（你可以有很多的複選框，只要你喜歡），使用此代碼。

var allButtons = document.getElementsByClassName("Button"); 
for (i=0; i<allButtons.length; i++) { 
    allButtons[i].checked = false; 
}

如果打算僅具有2個元素，可以使用

var allButtons = document.getElementsByClassName("Button"); 
for (i=0; i<2; i++) { 
    allButtons[i].checked = false; 
}

或

var allButtons = document.getElementsByClassName("Button"); 
allButtons[0].checked = false; 
allButtons[1].checked = false;

來源

2015-02-08 14:24:03 Data2000

它不返回數組。它返回一個節點列表。如果你嘗試調用它的數組方法，你會得到錯誤。 – Quentin 2015-02-08 14:24:37

@Quentin：編輯。我只是想簡化一些東西。無論如何，編輯。 :) – Data2000 2015-02-08 14:29:28

必須遍歷類元素！

var elements=document.getElementsByClassName('Button'); 

    Array.prototype.forEach.call(elements, function(element) { 
     element.checked = false; 
    });

來源

2015-02-08 14:25:53

要調用document.getElementsByClassName('Button').checked = false;當它應該是document.getElementsByClassName('Button')[1].checked = false;

getElementsByClassName()返回數組

function unCheck(){ 
 
    document.getElementsByClassName('Button')[1].checked = false; 
 
}

<input type="radio" name="sex" id="Button1" class="Button" /> 
 
<input type="radio" name="sex" id="Button2" class="Button" checked/> 
 
<input type="button" value="Uncheck Radio" onclick="unCheck()"/>

來源

2015-02-08 14:26:22 DelightedD0D

取消選中使用類

回答

相關問題