我正在尝试使用PHP和AJAX创建简单的登录系统。我的问题是，当我尝试提交signUp表单时，其验证工作有效，并且数据已保存到数据库中，但该表单不会动态重置。当我检查控制台时，有一些错误。请帮我解决这个问题。
<form id="signupForm" role="form" method="post" action="add-user-submit.php" enctype="multipart/form-data">
<div class="form-group">
<input type="text" name="username" id="username" class="form-control" placeholder="username" tabindex="1" >
</div>
<div class="row">
<div class="col-xs-12 col-sm-6 col-md-6">
<div class="form-group">
<input type="text" name="firstname" id="firstname" class="form-control" placeholder="First Name" tabindex="2" >
</div>
</div>
<div class="col-xs-12 col-sm-6 col-md-6">
<div class="form-group">
<input type="text" name="lastname" id="lastname" class="form-control" placeholder="Last Name" tabindex="3" >
</div>
</div>
</div>
<div class="row">
<div class="col-xs-12 col-sm-6 col-md-6">
<div class="form-group">
<input type="text" name="index_no" id="index_no" class="form-control" placeholder="C00007" data-charset="_XXXXX" tabindex="4" >
</div>
</div>
<div class="col-xs-12 col-sm-6 col-md-6">
<div class="form-group">
<select id="designation" name="designation" class="form-control m-bot15" >
<option>Select Designation</option>
<option value="O">Officer (O)</option>
<option value="OC">Officer Cash(OC)</option>
<option value="SO">Senior Officer(SO)</option>
<option value="SOC">Senior Officer Cash(SOC)</option>
<option value="PO">Principal Officer(PO)</option>
<option value="SPO">Senior Principal Oficer(SPO)</option>
<option value="AGM">Assistant General Manager(AGM)</option>
<option value="DGM">Deputy General Manager(DGM)</option>
<option value="GM">General Manager (GM)</option>
<option value="CITO">Chief Information Technology Officer(CITO)</option>
</select>
</div>
</div>
</div>
<div class="row">
<div class="col-xs-12 col-sm-6 col-md-6">
<div class="form-group">
<input type="tel" name="phone" id="phone" class="form-control" placeholder="Phone Number" tabindex="5" >
</div>
</div>
<div class="col-xs-12 col-sm-6 col-md-6">
<div class="form-group">
<input type="email" name="email" id="email" class="form-control" placeholder="Email Address" tabindex="5" >
</div>
</div>
</div>
<div class="row">
<div class="col-xs-12 col-sm-6 col-md-6">
<div class="form-group">
<input type="password" name="password" id="password" class="form-control" placeholder="Password" tabindex="5" >
</div>
</div>
<div class="col-xs-12 col-sm-6 col-md-6">
<div class="form-group">
<input type="password" name="confirm_password" id="confirm_password" class="form-control" placeholder="Confirm Password" tabindex="6" >
</div>
</div>
</div>
<div class="row">
<div class="col-xs-12 col-sm-6 col-md-6">
<div class="form-group">
<select id="level_access" name="level_access" class="form-control m-bot15" >
<option>Select Role</option>
<option value="1">Admin</option>
<option value="2">Manager</option>
<option value="3">User</option>
</select>
</div>
</div>
<div class="col-xs-12 col-sm-6 col-md-6">
<div class="form-group">
<select id="active" name="active" class="form-control m-bot15" >
<option value="1">Active</option>
<option value="2">inactive</option>
</select>
</div>
</div>
</div>
<div class="row">
<div class="col-xs-12 col-md-12"><input type="submit" value="Add" class="btn btn-primary btn-block " tabindex="7"></div>
</div>
</form>
function register() {
hideshow('loading', 1);
error(0);
$.ajax({
type: "POST",
url: "add-user-submit.php",
data: $('#signupForm').serialize(),
dataType: "json",
success: function(msg) {
if (parseInt(msg.status) == 1) {
$("#signupForm").reset();
//show the success message
$('.done').fadeIn('slow');
console.log(msg)
} else if (parseInt(msg.status) == 0) {
error(1, msg.txt);
}
hideshow('loading', 0);
}
});
}
未捕获的TypeError：$（...）。reset不是函数
在Object.success（common-scripts.js：41）
在l（jquery-1.8.3.min.js：2）
at Object.fireWith [as resolveWith]（jquery-1.8.3.min.js：2）
在T（jquery-1.8.3.min.js：2）
在XMLHttpRequest.r（jquery-1.8.3.min.js：2）
使用$("#signupForm").trigger('reset');
Uncaught TypeError: s[y] is not a function
at Object.trigger (jquery-1.8.3.min.js:2)
at HTMLFormElement.<anonymous> (jquery-1.8.3.min.js:2)
at Function.each (jquery-1.8.3.min.js:2)
at init.each (jquery-1.8.3.min.js:2)
at init.trigger (jquery-1.8.3.min.js:2)
at Object.success (common-scripts.js:41)
at l (jquery-1.8.3.min.js:2)
at Object.fireWith [as resolveWith] (jquery-1.8.3.min.js:2)
at T (jquery-1.8.3.min.js:2)
at XMLHttpRequest.r (jquery-1.8.3.min.js:2)
使用$("#signupForm")[0].reset();
Uncaught TypeError: $(...)[0].reset is not a function
at Object.success (common-scripts.js:41)
at l (jquery-1.8.3.min.js:2)
at Object.fireWith [as resolveWith] (jquery-1.8.3.min.js:2)
at T (jquery-1.8.3.min.js:2)
at XMLHttpRequest.r (jquery-1.8.3.min.js:2)
答案 0 :(得分：3)
reset()是本机Element对象而不是jQuery对象的函数。因此，您需要在调用reset()之前从jQuery对象中检索该元素，如下所示：
$("#signupForm")[0].reset();
// or
$("#signupForm").get(0).reset();
或者，为避免不得不从jQuery对象中检索元素，可以触发reset本身的form事件：
$("#signupForm").trigger('reset');
答案 1 :(得分：1)
如果您使用jQuery，请使用
$('#signupForm')[0].reset();
否则请使用Javascript
document.getElementById('signupForm').reset();
因为我们需要分别重置每个元素。 jQuery没有在窗体上起作用的reset（）函数。 reset（）是一个Javascript函数，仅适用于表单元素。
答案 2 :(得分：1)
在jQuery对象上调用reset()函数将不起作用。
reset()函数是常规的JavaScript函数，而不是jQuery函数，因此不适用于jQuery对象。
要使其正常工作，我们需要从jQuery对象中提取底层的DOM元素，然后才能调用该函数。
一个jQuery对象包含一个或多个DOM元素，您可以使用常规数组语法访问其中的元素，因此可以使用：
$("#signupForm")[0].reset();
另一种方法是通过调用触发重置事件
$("#signupForm").trigger('reset');