HTMLFormElement.reset() 当把触发事件的button id改为"reset "时无法调用reset()

测试地址:demo
在这个 demo 里,form 表单是可以重置的,但把触发事件的 button id:resetForm 改为 reset 后,报错:
图片描述

这个问题以前也碰到过,想知道这是为什么?

test.html

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="test reset()">
  <title>JS Bin</title>
</head>
<body>
  <form id="myForm">
    <input type="text"><br/>
    <input type="text"><br/>
    <input id="resetForm" type="button" value="reset">
  </form>
</body>

<script>
window.onload = function() {
  var reset = document.getElementById("resetForm");
  reset.onclick = function() {
    document.getElementById("myForm").reset()
  }
}
</script>
</html>
阅读 3.3k
2 个回答

你把 ID 设置成 submit 也不行. submitreset 是表单内input的两个type功能按钮. 不能设置为 ID. 你直接把<input type="reset">就行了

这个是表单历史 API ,可以直接通过 form.formElementName 或 form.formElementId 来获取表单内的元素,所以这句代码:

document.getElementById("myForm").reset()

运行到

document.getElementById("myForm").reset 

的时候,实际上是在 myForm 表单里获取了 name='reset' 或者 id='reset' 的元素,然后执行 () 当然会报错,不信你可以试试:

console.log(myform.reset===reset) //返回true
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题