利用JQuery实现Ajax,完成用户注册或修改个人信息时名称不能重复的校验
jsp页面中的注册表单部分
//ononsubmit:提交时触发checkAll()方法,若用户名,或密码邮箱等不合法,阻止其注册
<form action="用于验证用户名是否重复的servlet" method="post" onsubmit="return checkAll()">
//onblor:失去焦点时触发检查名字是否合法的Ajax验证
用户名:<input type="text" id="userInput" onblor="checkNameByJQuery()"/>
//这个标签用于提示用户姓名是否合法
<span id="userNameSpan"></span>
//提交
<input type="submit" value="注册提交"/>
</form>
jsp页面中的利用Ajax验证用户名是否重复部分
function checkNameByJQuery(){
var stuNameValue = $("#stuInput").val();
var reg = /^[a-z0-9\u4e00-\u9fa5]{2,}$/;
var stuSpan = $("#stuNameSpan");
var flag = false;
if(reg.test(stuNameValue)){
$.ajax({
url:"/StuManage/checkNameServlet",
data:{"stuName":stuNameValue},
type:"get",
async:false,
success:function(result){
if(result == "true"){
stuSpan.html("√").css("color","green");
return true;
}else{
stuSpan.html("用户名已存在").css("color","red");
return false;
}
}
});
}else{
stuSpan.html("用户名格式错误").css("color","red");
return false;
}
}
jsp页面中姓名验证失败,阻止提交部分
function checkAll(){
var result = checkNameByJQuery();
if(result == true){
return true;
}else{
return false;
}
}
判断用户名是否重复的servlet
String userName = request.getParameter("valueName");
List<User> listUser = new UserDao().findUserByName(userName);
if (listUser.size() == 0) {
response.getWriter().print("true");
} else {
response.getWriter().print("false");
}