jQuery 与 AJAX 实现失去焦点验证用户名是否合格

 

JSP页面

 

<tr
onmouseover="currentcolor=this.style.backgroundColor;this.style.backgroundColor='#f0f7ff'"
onmouseout="this.style.backgroundColor=currentcolor">
<td width="10%" class="main_matter_td">用户名</td>
<td width="40%" align="left" class="main_matter_td">
<input name="nameLc" id="nameLc" type="text" class="textBox" value="" size="24" onblur="isExist(this.value)"/>
<div id="checkResult">*</div>
<td width="10%" class="main_matter_td">真实姓名</td>
<td width="40%" align="left" class="main_matter_td">
<input name="realnameLc" id="realnameLc" type="text" class="textBox" value="" size="24" onblur="isExist1(this.value)"/>
<div id="checkResult1">*</div>
</tr>

 

JSP页面上调用AJAX方法 
<script type="text/javascript" src="../js/jquery-1.4.4.min.js"></script>
<script type="text/javascript">
//验证用户名是否存在
function isExist(nameLc){
var url_check = "aaaa.action?name="+nameLc;
$.ajax({
type: "POST",
url: url_check,
dataType: "text",
success: function(result){
if(result==1){
document.getElementById("checkResult").innerHTML="<font color=red>用户已经存在请重新输入！</font>";
}else if(result == 0){
document.getElementById("checkResult").innerHTML="<font color=red>用户可以使用！</font>";
}else{
document.getElementById("checkResult").innerHTML="<font color=red>用户不能为空！</font>";
}
}
});
}
</script>

 

action中 方法：

public String aaaa(){
int result = 0 ;
String name = get("name").toString();
name = name.replaceAll(" ", "");
System.out.println(" aaaa name-->"+name);
if("".equals(name)){
result = 2;
}else{
if(this.ocs.isExsitUserName(name)){
result = 1;
}else{
result = 0;
}
}

HttpServletResponse response = ServletActionContext.getResponse();
PrintWriter out = null;
response.setContentType("text/xml;charset=UTF-8");
try {
out = response.getWriter();
out.print(result);
System.out.println(result);
} catch (IOException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
return null;
}

 

 

这里是JQUERY和AJAX方法合作实现异步验证