表单重置无效

Question

我正在使用以下代码重置表单字段.

document.getElementById("form1").reset();//form1 is the form id.

它不起作用.我也尝试过JQuery.即使是JQuery也无法正常工作.

$("#reset").click(function(){
$('form1')[0].reset();
});

我的HTML代码是

<form name="form1" id="form1" method="post">
<h3>Personal Information</h3>
<h4>Name</h4>
<input type="text" id="fname" name="fname" maxlength=50 size=11/>
<input type="text" id="mname" name="mname" maxlength=15 size=8/>
<input type="text" id="lname" name="lname" maxlength=50 size=11/>
<input type="button" id="reset" value="Reset" onclick="Reset()"/>
</form>

我正在关注W3Schools.这是我的小提琴.你能解释一下这个错误吗？

Answer 1

问题是您将按钮ID设置为"reset".因此,您的表单重置方法被按钮元素覆盖.只需为您的按钮使用不同的ID.

<form name="form1" id="form1" method="post">

<h3>Personal Information</h3> 

<h4>Name</h4>

    <input type="text" id="fname" name="fname" maxlength="50" size="11" />
    <input type="text" id="mname" name="mname" maxlength="15" size="8" />
    <input type="text" id="lname" name="lname" maxlength="50" size="11" />
    <input type="button" id="resetBtn" value="Reset" />
</form>

另外,请避免使用内联事件处理程序.在实际脚本中绑定事件.
看到这个小提琴.

Answer 2

我终于解决了我的问题。问题是"id=reset"。因为它重写了reset方法。我把它改为id="reset1". 现在它正在工作