HTML | DOM 表单 reset() 方法(1)

📌 相关文章

📜 HTML | DOM 表单 reset() 方法(1)

📅 最后修改于: 2023-12-03 15:01:13.183000 🧑 作者: Mango

HTML | DOM 表单 reset() 方法

简介

reset() 方法是 HTML | DOM 表单中的一个方法，它可以将表单中的所有控件值重置为默认值。

该方法可以通过 JavaScript 来调用。

语法

formObject.reset()

其中，formObject 是要重置的表单。

示例

以下是一个示例，在点击按钮时，会将表单中的值重置为默认值：

<!DOCTYPE html>
<html>
<body>
  <form id="myForm">
    <label for="name">Name:</label>
    <input type="text" id="name" name="name" value="John"><br><br>
    <label for="age">Age:</label>
    <input type="text" id="age" name="age" value="25"><br><br>
    <label for="gender">Gender:</label>
    <select id="gender" name="gender">
      <option value="male">Male</option>
      <option value="female">Female</option>
    </select><br><br>
    <label for="comment">Comment:</label><br>
    <textarea id="comment" name="comment" rows="5" cols="40"></textarea><br><br>
    <button type="button" onclick="resetForm()">Reset</button>
  </form>
  <script>
    function resetForm() {
      document.getElementById("myForm").reset();
    }
  </script>
</body>
</html>

在这个表单中，有一个文本框、一个下拉框和一个文本域。当点击 Reset 按钮时，表单中的所有值都会重置为默认值。

注意事项

reset() 方法重置表单时，不会将表单中的 disabled 属性的控件值重置为默认值。
reset() 方法可以通过 JavaScript 程序来调用。