1.简单用法
$(function() {
$("input[name='name']").on("blur", function() {
/*移除文本内的内容 $("#s1").empty(); */
$("#s1").empty();
$.post(
"${pageContext.servletContext.contextPath }/AjaxUser.do?username="
+ $(this).val(), function(data, status) {
$("#s1").html(data.msg);
})
});
})
2.多功能用法
$(function(){
$("input[name='username']").on("blur",function(){
$.ajax({
url:"${pageContext.servletContext.contextPath }/checkuser", //规定发送请求的 URL。默认是当前页面。
type:"post", //http请求类型 get|post
data:"username="+$("input[name='username']").val(), //规定要发送到服务器的数据。
dataType:"json", //预期的服务器响应的数据类型; json|html/text
success:function(data){ // 当请求成功时运行的函数。{"code":"yes","msg":"用户已经注册"} | {"code":"no"}
$("#msg").empty();
if(data.code == "yes"){
$("input[name='username']").after("<span id='msg' style='color:red;font-size:14px'>"+data.msg+"</span>");
}
},
error:function(xhr,status,error){ //如果请求失败要运行的函数。
alert(error+" "+status);
}
});
})
})
public class Info {
private String msg;
public String getMsg() {
return msg;
}
public void setMsg(String msg) {
this.msg = msg;
}
}
/**
* ajax异步查询验证
* @param username
* @param request
* @return
*/
@ResponseBody//返回Json格式
@RequestMapping(value = "AjaxUser", method = RequestMethod.POST)
public Info AjaxUser(String username, ServletRequest request) {
Info info = new Info();
if (username != "") {
User user = userService.selectUserByName(username);
if (user != null) {
info.setMsg("用户已存在!");
}
}
return info;
}