javascript怎么重置-前端问答-PHP中文网

javascript怎么重置

王林

发布： 2023-05-17 15:41:09

原创

1803人浏览过

javascript 是一种常用的脚本语言，用于网页前端开发和交互设计，比如实现表单的验证和交互效果等。在开发网页过程中，可能会遇到需要重置表单数据的需求。那么，javascript 怎么重置表单呢？

什么是表单重置？

重置表单指将表单中填写的数据清空，恢复到表单初始化时的状态。当用户填写了一些信息提交表单后，如果需要重新填写，一种简便的方法就是对表单进行重置。

使用 JavaScript 重置表单

在 JavaScript 中，可以使用 reset() 方法来重置表单。此方法适用于所有表单元素和表单控件类型。下面是使用 JavaScript 重置表单的示例代码：

<form id="myForm">
  <label for="name">Name:</label>
  <input type="text" id="name" name="name"><br><br>
  <label for="age">Age:</label>
  <input type="number" id="age" name="age"><br><br>
  <input type="button" value="Reset" onclick="resetForm()">
  <input type="submit" value="Submit">
</form>

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

登录后复制

在该示例代码中，使用 resetForm() 函数对表单进行重置。该函数使用 getElementById() 方法获取表单元素，然后调用 reset() 方法进行重置。在 HTML 代码中，可以通过按钮的 onclick 事件触发该函数执行。