在ajax表单提交代码中遇到问题

Question

<form action="" method="post" class="f-color" id="email-form">
{% csrf_token %}
<label>Name</label>
<input type="text">
<label>From</label>
<input type="email">
<label>Message</label>
<button type="submit">Sent</button>
</form>
<div class="mt-5" id="spin" style="display: none;">
<div class="loader"></div>
</div>
<div id="msg"></div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$(document).on("submit", "#email-form", function(event){
event.preventDefault();
$('#spin').show();
$.ajax({
url: "{% url 'contact' %}",
type: "POST",
data: $("#email-form").serialize(),
success: function(data){
$("#spin").hide();
if(data.status == "success"){
$("#msg").html("<p class='alert alert-success'>we will get back to you as soon as possible</p>" );
$("#email-form").reset();
}
}
})
})
})
</script>

使用此代码，我可以成功提交表单，但在表单提交后，消息(msg(没有显示，"if条件语句"完全有效(对于我发出警报的测试，警报有效(另一个问题是表单重置，为此我使用

$("#email-form").reset();

但是表单没有重置我该如何解决这些问题

Answer 1

尝试

$('#email-form')[0].reset();

https://stackoverflow.com/a/3786702/8640027

Answer 2

在ajax表单提交后，我得到了一个重置表单的解决方案

$("#email-form").trigger("reset");