清除div内任何输入值的简单方法？

Question

是否有一种简单的方法来迭代元素中的子元素，比如div，如果它们是任何类型的输入(广播、选择、文本、隐藏的.)清除他们的价值？

编辑添加链接到示例解决方案代码。，感谢古法和其他应答者！我从中学到了！

Answer 1

我想您想要清除所有的子级，而不仅仅是直接的子级，所以它必须是递归的。由于不同的输入元素被不同地清除，您必须检查它们的类型，以便知道如何处理它们。我认为您也希望清除文本区域，但保留按钮不变：

function clearChildren(element) {
   for (var i = 0; i < element.childNodes.length; i++) {
      var e = element.childNodes[i];
      if (e.tagName) switch (e.tagName.toLowerCase()) {
         case 'input':
            switch (e.type) {
               case "radio":
               case "checkbox": e.checked = false; break;
               case "button":
               case "submit":
               case "image": break;
               default: e.value = ''; break;
            }
            break;
         case 'select': e.selectedIndex = 0; break;
         case 'textarea': e.innerHTML = ''; break;
         default: clearChildren(e);
      }
   }
}

使用元素的引用调用它：

clearChildren(document.getElementById('IdOfTheDiv'));

编辑：

忘了选择..。

编辑2：

一些修正: childNodes.length，处理没有tagName和大写tagName值的元素。

Answer 2

使用JQuery非常简单：

$('#myDiv').children().find('input,select').each(function(){
   $(this).val('');
});

我们可以在“查找”电话中放置尽可能多的标签。

Answer 3

哦，天哪，这将是jQuery的一条邮轮：

$(':input:not(:button)', div).val([])

如果没有jQuery，您必须考虑<select>字段、文本字段、密码字段和无线电/复选框字段：

function clearFields(container) {
    var selects = container.getElementsByTagName('select');

    for(var i=0, len=selects.length; i < len; i++) {
        selects[i].selectedIndex = -1;
    }

    var fields = container.getElementsByTagName('input');
    for(var i=0, len=fields.length; i < len; i++) {
        var field = fields[i];
        switch(field.type)
        {
            case 'radio':
            case 'checkbox':
                field.checked = false;
                break;

            case 'text':
            case 'password':
            case 'hidden':
                field.value = ''
        }
    }

    var fields = container.getElementsByTagName('textarea');
    for(var i=0, len=fields.length; i < len; i++) {
        fields[i].value = ''
    }
}