在JSP页面下使用AJAX实现用户名存在的检测

<script type="text/javascript">
    function init(){
        document.getElementById("username").focus();
    }
    function validate(userfield) {
        if (trim(userfield.value).length != 0) {
            var xmlHttpRequest = null;
            var url = "../AccountIsExistServlet?account=" + userfield.value;
            var usermsg = document.getElementById("usermsg");
            if (window.XMLHttpRequest) {//表示前浏览器IE
                xmlHttpRequest = new XMLHttpRequest();
            else if (window.ActiveXObject) {
                xmlHttpRequest = new ActiveXObject("Microsoft.XMLHTTP");
            }
            xmlHttpRequest.open("GET", url, true);//设置请求式GET设置请求URL设置异步提交
            xmlHttpRequest.onreadystatechange = function(){//址复制给onreadystatechange属性
                if(xmlHttpRequest.readyState == 4){//Ajax引擎状态功
                    if(xmlHttpRequest.status == 200){//HTTP协议状态功
                        if(trim(xmlHttpRequest.responseText) != ""){
                            usermsg.innerHTML = "<font color='red'>" + trim(xmlHttpRequest.responseText) + "</font>";
                            userfield.focus();
                        }else{
                            usermsg.innerHTML = "恭喜您用户名使用 ";
                        }
                    }else{
                        alert("请求失败错误码=" + xmlHttp.status);
                    }
                }
            };
            xmlHttpRequest.send(null);//设置信息发送Ajax引擎
        }else{
            usermsg.innerHTML = "";
        }
    }
<tr height="30px;">
    <td><font color="#FF0000">*</font>用户名:</td>
    <td><input type="text" name="account" id="username" maxlength="12" onblur="validate(this)"/></td>
    <td width="220px;"><span id="usermsg"></span></td>
</tr>
import java.io.IOException;
import java.io.PrintWriter;
 
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
 
import com.gas.bo.UserInfoBO;
 
@WebServlet("/AccountIsExistServlet")
public class AccountIsExistServlet extends HttpServlet {
 
    protected void doGet(HttpServletRequest request,
            HttpServletResponse response) throws ServletException, IOException {
        // 阻止缓存
        response.setContentType("text/xml");
        response.setHeader("Cache-Control""no-store"); // HTTP1.1
        response.setHeader("Pragma""no-cache"); // HTTP1.0
        response.setDateHeader("Expires"0); // prevents catching at proxy
                                                // server
 
        PrintWriter out = response.getWriter();
         
        //js传汉字进行转码避免汉字候现乱码
        String account = request.getParameter("account");
        UserInfoBO userInfoBO = new UserInfoBO();
        boolean b = userInfoBO.accountIsExist(account);
        if (b) {
            out.print("用户名已存请重新输入");
        }
    }
 
}
posted @ 2016-05-04 14:06  我不会游泳  阅读(1899)  评论(0编辑  收藏  举报