当用户更改选择选项时，jQuery重置表单

Question

我创建了一个包含很多if语句的表单，当用户选择某些对象时，其他对象的值会发生变化等。

表单主要取决于用户做出的第一个决定，目前，如果用户填写表单然后更改第一个选择，表单值不会更改以反映第一个更改，所以我想重置更改第一个选择框时的表单。

这是我的第一个下拉框的html：

<article id="event_type_container">
 <h4 class="calc_title">EVENT TYPE</h4>
 <form action="quote_mailer.php" method="POST" name="myform" id="quote_form" onsubmit="Dosubmit();">
<select class="select" id="eventType" name="eventType" size="1">
    <option name="first" value="0"></option>
    <option value="wedding" name="wedding">Wedding</option>
    <option value="private_party" name="private_party">Private Event</option>
    <!--<option value="corporate" name="corporate">Corporate Event</option>-->
 </select>
</article>

有没有办法使用jQuery，如果用户选择一个选项我可以重置整个表单？

Answer 1

您可以在Javascript中重置一个表单，调用表单对象上的reset()。

使用jQuery捕获select的change事件将告诉您何时重置表单。

$("#quote_form").on("change", "#eventType", function(event){
    event.delegateTarget.reset();
});

Answer 2

$("#eventType").on("change",function(){

// desire code

/*** reset form code below **/
$(this).closest("form")[0].reset();

});

Answer 3

您仍然可以使用

重置整个表单

$('#quote_form')[0].reset();

此处表单重置与html中的重置按钮功能相同。