Javascript 单选按钮清除文本框

我有两个单选按钮：单击第一个单选按钮，如果他们开始输入信息，然后改变主意并选择第二个单选按钮，则会出现三个文本框。如果没有清除他们输入的文本，则会出现第二个单选按钮。所以我想弄清楚的是，当选择同一组的一个新单选按钮时，是否有一种方法可以清除这些文本框中的文本。非常感谢您的帮助

---

在检查其他收音机时，您始终可以使用此功能：

$("#div1 .clearfix input:text").val("");

函数showHideFormline{ 如果留置权==是{ document.getElementByIddiv1.style.display='block'； document.getElementByIddiv2.style.display='none'； } 如果LINE==无，则为else{ document.getElementByIddiv2.style.display='block'； document.getElementByIddiv1.style.display='none'； $div1.clearfix输入：text.val；//此处用于清除输入 } } 留置权 无留置权 留置权持有人姓名：

留置权持有人地址：

留置权日期：

---

一种方法是使用问答/JS Fiddle演示中的普通JavaScript：

function showhideForm(lien) {
    if (lien == "Yes") {
        document.getElementById("div1").style.display = 'block';
        document.getElementById("div2").style.display = 'none';
    } else if (lien == "None") {
        document.getElementById("div2").style.display = 'block';
        document.getElementById("div1").style.display = 'none';

        // getting all the input elements within '#div1' (using a CSS selector):
        var inputs = document.querySelectorAll('#div1 input');

        // iterating over those elements, using Array.prototype.forEach,
        // and setting the value to '' (clearing them):
        [].forEach.call(inputs, function (input) {
            input.value = '';
        });

    }
}

略为简练的上述形式，或者，如果不更简练，则重复较少：

function showhideForm(lien) {    
    var isYes = lien.trim().toLowerCase() === 'yes',
        div1 = document.getElementById('div1'),
        div2 = document.getElementById('div2');

    div1.style.display = isYes ? 'block' : 'none';
    div2.style.display = isYes ? 'none' : 'block';

    if (!isYes) {
        [].forEach.call(div1.getElementsByTagName('input'), function (input) {
            input.value = '';
        });
    }
}

最后是一个版本，它摆脱了在线事件处理onclick、onchange等的引人注目的JavaScript：

参考资料：

. . . . . . . .

---

你给OP一个jQuery库来处理1个javascript事件？似乎太多了。@AlexChar OP的代码中没有一行jQuery。可能是个迷雾，但我同意这是在头顶上。还要注意的是，jQuery没有加载到fiddle中，但这并不是一个100%明确的决定性因素create和一种替代的js方法：

function showhideForm(lien) {    
    var isYes = lien.trim().toLowerCase() === 'yes',
        div1 = document.getElementById('div1'),
        div2 = document.getElementById('div2');

    div1.style.display = isYes ? 'block' : 'none';
    div2.style.display = isYes ? 'none' : 'block';

    if (!isYes) {
        [].forEach.call(div1.getElementsByTagName('input'), function (input) {
            input.value = '';
        });
    }
}

function showhideForm() {
    // 'this' in the function is the radio-element to which
    // the function is bound as an event-handler: 
    var isYes = this.value.trim().toLowerCase() === 'yes',
        div1 = document.getElementById('div1'),
        div2 = document.getElementById('div2');

    div1.style.display = isYes ? 'block' : 'none';
    div2.style.display = isYes ? 'none' : 'block';

    if (!isYes) {
        [].forEach.call(div1.getElementsByTagName('input'), function (input) {
            input.value = '';
        });
    }
}

// finding the elements with the name of 'lien':
var lienRadios = document.getElementsByName('lien');

// iterating over those elements, using forEach (again):
[].forEach.call(lienRadios, function (lien) {
    // adding a listener for the 'change' event, when it
    // occurs the showhideForm function is called:
    lien.addEventListener('change', showhideForm);
});