关于通过jQuery重置联系表单的问题

Question

您能否看一下此演示，并让我知道为什么我无法重置表格？

这是我正在使用的代码：

$(function () {
    $("#reset").on("click", function (e) {
        e.preventDefault();
        //$('#theForm')[0].reset();
        $('#theForm').trigger("reset");
    });
});

如您所见，我已经尝试了两个$('#theForm')[0].reset(); 和$('#theForm').trigger("reset"); 但都无法正常工作，您也可以让我知道如何在提交时重新设置吗？ 谢谢

Answer 1

您为什么不只使用真正的重置按钮？ <input type="reset" >

Answer 2

将您的重置按钮的ID重命名为“ resetbtn”即可！

现在，发生了什么...如果调试JavaScript代码，您会注意到$（'＃theForm'）[0] .reset是指按钮，而不是reset函数。 看起来，通过在表单中​​的字段中提供ID“重置”，您就无意间覆盖了重置功能。

我敢肯定，对Javascript有更多了解的人会告诉您这里真正发生的事情，以及是否有更好的解决方法。

更新检查此链接： https : //developer.mozilla.org/zh-CN/docs/Web/API/HTMLFormElement.reset

如果表单控件（例如重置按钮）具有重置的名称或ID，它将屏蔽表单的重置方法。 它不会重置输入中的其他属性，例如禁用。