这是我正在使用的jsp页面。我在jsp中编写了javascript。我已经对表单进行了一些验证，然后使用了ajax调用。请检查我在jsp中是否做错了。
<!DOCTYPE html>
<html>
<head>
<meta charset="ISO-8859-1">
<title>Register page</title>
</head>
<body>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<h3>Student registration form:</h3>
<form action="RegisterController" method="get" id="registerForm" name="stud" >
<table>
<tr>
<td><label>Username:</label></td>
<td><input type="text" name="uname" id="uname"></td><td><label id="nameId"></label></td>
</tr>
<tr>
<td><label>Email id:</label></td>
<td><input type="text" name="email" id="email"></td><td><label id="emailId"></label></td>
</tr>
<tr>
<td><label>Contact No:</label></td>
<td><input type="number" name="contact" id="contact"></td><td><label id="contactId"></label></td>
</tr>
<tr>
<td><label>Address:</label></td>
<td><textarea name="address" rows="3" cols="20" id="address"></textarea></td><td><label id="addressId"></label></td>
</tr>
<tr>
<td>Select City:</td>
<td>
<input type="text" list="city" name="cities" id="cities">
<datalist id="city">
<option value="Mumbai">Mumbai</option>
<option value="Pune">Pune</option>
<option value="Nashik">Nashik</option>
<option value="Solapur">Solapur</option>
</datalist>
</td><td>
<label id="cityId"></label>
</td>
</tr>
<tr>
<td>Gender:</td>
<td><input id="r1" type="radio" name="gender" value="male">Male<input id="r2" type="radio" name="gender" value="female">Female</td><td><label id="genderId"></label></td>
</tr>
<tr>
<td><label>Courses:</label></td>
<td>Java<input id="cb1" type="checkbox" name="course" value="java">Spark<input id="cb2" type="checkbox" name="course" value="spark">Hadoop<input id="cb3" type="checkbox" name="course" value="hadoop">PHP<input id="cb4" type="checkbox" name="course" value="php"></td><td><label id="courseId"></label></td>
</tr>
<tr>
<td>Select Time Preferable</td>
<td>
<select name="batches" id="batches">
<option value="7 am to 8 am">7 am to 8 am</option>
<option value="9 am to 10 am">9 am to 10 am</option>
<option value="11 am to 12 pm">11 am to 12 pm</option>
</select>
</td>
</tr>
</table>
<br>
<input type="submit" value="Register" id="Register"><br><br>
</form>
<a href="index.jsp">Go to login page</a>
</body>
<script type="text/javascript">
$(document).ready(function(){
$('#registerForm').submit(function(es){
es.preventDefault();
var name=$('#uname').val();
var email=$('#email').val();
var contact=$('#contact').val();
var address=$('#address').val();
var city=$('#cities').val();
var gender1=$('#r1').is(":checked");
var gender2=$('#r2').is(":checked");
var cbOne=$('#cb1').is(":checked");
var cbTwo=$('#cb2').is(":checked");
var cbThree=$('#cb3').is(":checked");
var cbFour=$('#cb4').is(":checked");
$('.error').remove();
//validating fields of form
if(name.length<=0){
$('#nameId').after('<span class="error" style="color:red">Enter the Username</span>');
}
if(contact.length!=10){
$('#contactId').after('<span class="error" style="color:red">Enter valid contact number</span>');
}
if(address.length<=0){
$('#addressId').after('<span class="error" style="color:red">Enter the address</span>');
}
if(city.length<=0){
$('#cityId').after('<span class="error" style="color:red">Enter the city</span>');
}
if(!(gender1||gender2)){
$('#genderId').after('<span class="error" style="color:red">Select gender</span>');
}
if(!(cbOne||cbTwo||cbThree||cbFour)){
$('#courseId').after('<span class="error" style="color:red">Select at least one course</span>')
}
if(email.length<=0){
$('#emailId').after('<span class="error" style="color:red">Enter the email</span>');
}
else{
//var regEx=/^\w+@[a-zA-Z_]+?\.[a-zA-Z]{2,3}$/;
//var regEx=/^\w+@[a-zA-Z]+\.[a-zA-Z]{2,3}$/;
var regEx=/^[a-zA-Z0-9]+@[a-zA-Z]+\.[com]{3}$/;
var validEmail=regEx.test(email);
if(!validEmail){
$('#emailId').after('<span class="error" style="color:red">Enter valid email</span>');
}
}
//data to be passed
var form_data={
username:$('#uname').val(),
email:$('#email').val(),
contact:$('#contact').val(),
address:$('#address').val(),
city:$('#cities').val(),
batch:$('#batches').val()
};
//ajax call goes here
$.ajax({
type: 'GET',
url: './RegisterController',
dataType: 'json',
data: form_data,
success: function(){
console.log("Sucess: ");
},
error : function(message) {
alert("error: "+message);
}
});
});
} );
</script>
</html>
我正在创建一个注册表单，并希望使用ajax调用传输表单数据。为此我编写了JavaScript。但是Ajax调用正在触发错误功能。我没有弄清楚代码中有什么问题。
<script type="text/javascript">
$(document).ready(function(){
$('#registerForm').submit(function(es){
es.preventDefault();
var form_data={
username:$('#uname').val(),
email:$('#email').val(),
contact:$('#contact').val(),
address:$('#address').val(),
city:$('#cities').val(),
batch:$('#batches').val()
};
$.ajax({
type: 'GET',
url: 'RegisterController',
data: form_data,
success: function(){
console.log("Sucess: ");
},
error : function(message) {
alert("error: "+message);
}
});
});
} );
</script>
答案 0 :(得分：0)
您是否尝试过将响应放入成功函数中，以检查是否收到来自网址的响应？
$.ajax({
type: 'GET',
url: 'RegisterController',
data: form_data,
success: function(response){
console.log("Sucess:" + response );
},