javascript - 选中/取消选中 radio

Question

制作了这个脚本

function Resetradio() {
var radios = document.getElementsByName("tjek");

var i = 0;
while (i < radios.length) {
    if (radios[i].checked) 
    selectedradio = i;
    i++;
}
var i = 0;
while (i < radios.length) {
    if (!selectedradio == i) 
    radios.checked = false
    i++;
}
}
<form name="Form1" action="" method="get">
    <input name="tjek" type="radio" value="" onclick="Resetradio()" />
    <input name="tjek" type="radio" value="" onclick="Resetradio()" />
    <input type="submit" value="Send" />
</form>

<form name="Form2" action="" method="get">
    <input name="tjek" type="radio" value="" onclick="Resetradio()" />
    <input name="tjek" type="radio" value="" onclick="Resetradio()" />
    <input type="submit" value="Send" />
</form>

http://jsfiddle.net/dhP3K/

它应该运行所有 radio 并收集选定的 radio ，然后再次运行它们以取消选择所有其他 radio (如果有任何其他选定的 radio )。问题出在哪里？

Answer 1

它不起作用，因为您可以选择多个按钮。因此 selectedradio 将始终是所选按钮的最高索引。如果您尝试选择索引较低的按钮，它将在第二个循环中立即“重置”。想一想:

• 按钮 3 被选中 -> selectedradio === 3
• 按钮 0、1 和 2 已重置
• 按钮 1 被选中 -> selectedradio === 3，因为 radios[3].checked 仍然是 true。
• 按钮 0、1 和 2 已重置

因此，无需遍历按钮来找出选择了哪个按钮，只需将所选按钮的引用传递给函数即可:

function Resetradio(selected) {
    var radios = document.getElementsByName("tjek");

    var i = 0;
    while (i < radios.length) {
        if (radios[i] !== selected) 
        radios[i].checked = false
        i++;
    }
}

被调用

onchange="Resetradio(this)"