js实现清空表单

<form id="myForm">
  <input type="text" name="username" value="默认值">
  <input type="password" name="password">
  <button type="button" onclick="resetForm()">清空表单</button>
</form>

<script>
function resetForm() {
  document.getElementById('myForm').reset();
}
</script>

<form id="myForm">
  <input type="text" name="username" value="默认值">
  <input type="password" name="password">
  <button type="button" onclick="clearForm()">清空表单</button>
</form>

<script>
function clearForm() {
  const form = document.getElementById('myForm');
  const elements = form.elements;
  for (let i = 0; i < elements.length; i++) {
    const element = elements[i];
    const type = element.type.toLowerCase();
    
    // 跳过按钮、提交、重置等非输入字段
    if (type === 'button' || type === 'submit' || type === 'reset') {
      continue;
    }
    
    // 清空输入字段
    if (type === 'text' || type === 'password' || type === 'textarea') {
      element.value = '';
    } else if (type === 'checkbox' || type === 'radio') {
      element.checked = false;
    } else if (type === 'select-one') {
      element.selectedIndex = 0;
    }
  }
}
</script>

<form id="myForm">
  <input type="text" name="username" value="默认值">
  <input type="password" name="password">
  <button type="button" onclick="clearFormWithFormData()">清空表单</button>
</form>

<script>
function clearFormWithFormData() {
  const form = document.getElementById('myForm');
  const formData = new FormData(form);
  
  // 这里可以对formData做处理，例如发送到服务器
  
  // 清空表单
  form.reset();
}
</script>