js 清空form

在JavaScript中清空一个表单（form）通常意味着将表单内所有输入字段的值重置为它们的初始状态。以下是一些常见的方法来清空表单：

方法一：使用reset()方法

HTML表单元素有一个内置的reset()方法，可以用来将表单重置为其默认值。

// 假设form的id为'myForm'
document.getElementById('myForm').reset();

这种方法的优点是简单易用，但缺点是它只会将表单字段重置为它们的默认值（即HTML中定义的值），而不是完全清空。

方法二：遍历表单字段并手动清空

如果你想要完全清空表单，包括那些没有默认值的字段，你可以遍历表单的所有输入元素，并将它们的值设置为空字符串。

function clearForm() {
  var form = document.getElementById('myForm');
  var elements = form.elements;
  for (var i = 0; i < elements.length; i++) {
    var element = elements[i];
    var type = element.type.toLowerCase();

    switch (type) {
      case 'text':
      case 'password':
      case 'textarea':
      case 'hidden':
        element.value = '';
        break;
      case 'radio':
      case 'checkbox':
        if (element.checked) {
          element.checked = false;
        }
        break;
      case 'select-one':
      case 'select-multiple':
        element.selectedIndex = -1;
        break;
      default:
        // 处理其他类型的表单元素
        break;
    }
  }
}

// 调用函数清空表单
clearForm();

这种方法的优点是可以完全控制表单的清空过程，包括处理不同类型的表单元素。