Javascript 条件 - 取消选中隐藏 div 中的单选按钮？

Question

我正在尝试为表单设置一个条件类型的单选按钮，我实际上修改了我在这里找到的一些 javascript，看起来像这样:

function hideStuff(id) {
    document.getElementById('flatDiv').style.display = 'none';
    document.getElementById('salaryDiv').style.display = 'none';
}

function checkType(selectedType) {

    if (selectedType == 'flat') {
        document.getElementById('flatDiv').style.display = 'block';
        document.getElementById('salaryDiv').style.display = 'none';
    } else {
        document.getElementById('flatDiv').style.display = 'none';
        document.getElementById('salaryDiv').style.display = 'block';
    }
}

html 是这样的:

<input type="radio" name="Type" value="flat" onclick="checkType(this.value)" />Flat
<input type="radio" name="Type" value="salary" onclick="checkType(this.value)" />Salaray
<br />
<div id="salaryDiv" style="display:none;">Choose an option:
    <input type="radio" name="salaryType" value="1x" />1x
    <input type="radio" name="salaryType" value="2x" />2x
    <input type="radio" name="salaryType" value="3x" />3x</div>
<div id="flatDiv" style="display:none;">Choose an option:
    <input type="radio" name="flatType" value="$25,000" />$25,000
    <input type="radio" name="flatType" value="$50,000" />$50,000</div>

jsFiddle

一切正常，但如果有人点击薪水并选择一个选项然后改变主意，当他们点击 Flat 我想清除他们之前在薪水下所做的任何选择(反之亦然)我试过一些不起作用的东西，所以我想我会问问知道他们在做什么的人。谢谢。

Answer 1

创建函数 clearRadio 并将其分配给具有 onchange 属性的 radio 输入 flat 和 salary。

HTML

<input type="radio" name="Type" value="flat" onclick="checkType(this.value)" onchange="clearRadios('flatDiv')" />Flat
    <input type="radio" name="Type" value="salary" onclick="checkType(this.value)" onchange="clearRadios('salaryDiv')" />Salary

JavaScript

function clearRadios(id) {
    var Radios = document.getElementById(id).getElementsByTagName('input');
    for (var i = 0; i < Radios.length; i++) {
        if (Radios[i].type == 'radio') {
            Radios[i].checked = false;
        }
    }
}

该函数将使用传递的 id 找到 div 中的所有 radio 输入并清除它们。

jsfiddle