获取J.S中窗体的所有子元素

Question

如何获取所有子元素(如单选、复选框、选择、文本等)并使用javascript将它们设置为空白。我的表单有许多其他元素，如table、div等，但我不想更改这些其他元素。

通过表单名称(Frmlist)或表单id(frmlist)获取这些子元素( form元素)并将它们设置为空的任何合适的想法。实际上，我以前不知道表单中有多少个元素，以及这些元素的名称/ids是什么。

非常感谢。

Answer 1

尝试如下所示：

示例表单：

<form name="data_entry" action="#">
    Company Name: <input type="text" name="company_name">
    Select Business Type: <input type="radio" name="business_category" value="1"> Manufacturer
    <input type="radio" name="business_category" value="2"> Whole Sale Supplier
    <input type="radio" name="business_category" value="3"> Retailer
    <input type="radio" name="business_category" value="4"> Service Provider
    Email Address: <input type="text" size="30" name="email">
    Keep Information Private: <input type="checkbox" name="privacy">
    <input type="button" name="reset_form" value="Reset Form" onclick="this.form.reset();">
    <input type="button" name="clear" value="Clear Form" onclick="clearForm(this.form);">
</form>

示例Javascript：

for (i = 0; i < frm_elements.length; i++) {
    field_type = frm_elements[i].type.toLowerCase();
    switch (field_type) {
    case "text":
    case "password":
    case "textarea":
    case "hidden":
        frm_elements[i].value = "";
        break;
    case "radio":
    case "checkbox":
        if (frm_elements[i].checked) {
            frm_elements[i].checked = false;
        }
        break;
    case "select-one":
    case "select-multi":
        frm_elements[i].selectedIndex = -1;
        break;
    default:
        break;
    }
}

来自Using Javascript to Reset or Clear Form。

Answer 2

有时我们会忘记旧的解决方案。为什么不在这里丢弃javascript，使用：

<input type="reset" value = "CLEAR all"/>

请参阅this jsfiddle

Answer 3

您应该考虑使用jQuery。这就像做以下事情一样简单：

$(':input')
  .not(':button, :submit, :reset, :hidden')
  .val('')
  .removeAttr('checked')
  .removeAttr('selected');