用户更改选择选项时jQuery重置表单[重复]答案

【问题标题】：jQuery reset form when user changes select option [duplicate]用户更改选择选项时jQuery重置表单[重复]
【发布时间】：2014-05-20 13:59:56
【问题描述】：

我创建了一个包含很多 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 的方法，如果用户选择一个选项，我可以重置整个表单？

【问题讨论】：

标签： jquery forms reset

【解决方案1】：

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

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

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

【讨论】：

【解决方案2】：

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

// desire code

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

});

【讨论】：

这样做还会重置刚刚更改的表单字段，这会让用户感到困惑。

【解决方案3】：

您仍然可以使用

重置整个表单

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

这里的表单重置与html中重置按钮的功能相同。

【讨论】：