Ajax+js验证用户名是否存在

关于Ajax的原理和更为详细的创建步骤给大家推荐一篇博客
AJAX–XMLHttpRequest五步使使用方法 - cynchanpin - 博客园 https://www.cnblogs.com/cynchanpin/p/7039426.html

js文件

//浏览器一起动就判断浏览器 获取XMLHttpRequest
/*创建异步对象的函数    */
function createXMLHttpRequest() {
    try {
        return new XMLHttpRequest();//常用的浏览器创建

    } catch (e) {
        try {
            return ActiveXObject("Msxml2.XMLHTTP");//IE6.0  
        } catch (e) {
            try {
                return ActiveXObject("Micrsoft.XMLHTTP");//IE5.5 
            } catch (e) {
                alert("当前浏览器不支持异步操作！"); 
                throw e;
            }
        }
    }
}

//窗体加载的时候
window.onload = function() {
    var user = document.getElementById("name");
    user.onblur = function() {
        var xmlhttp = createXMLHttpRequest();//1.创建了一个xmlhttp
        xmlhttp.open("POST", "check", true);//2.打开和服务器
        xmlhttp.setRequestHeader("Content-type",
                "application/x-www-form-urlencoded");//3.设置响应头
        xmlhttp.send("username=" + user.value);//4.发送消息给服务器
        xmlhttp.onreadystatechange = function() {
            //alert("readyState:"+xmlhttp.readyState+"status:"+xmlhttp.status)
            if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { //双重判断:xmlHttp的状态为4（服务器响应结束），以及服务器状态码为200(服务器响应成功)
                var text = xmlhttp.responseText;
                 var namespan=document.getElementById("namespan");
                    if(text=="true"){
                        namespan.innerHTML="<font color='red' size='3'>用户名已被使用</font>";

                    }else{
                         namespan.innerHTML="<font color='green' size='3'>用户名可用</font>";
                    }
            }
        }
    }
}

action:check

@ResponseBody   //将函数返回值作为请求返回值，没有这个注解的话，请求的响应应该是一个页面，不需要页面的话应该加上这个注解。
    @RequestMapping(value="check",method=RequestMethod.POST)
    public void check(TUser user) throws IOException {
        System.out.println("check"+user);
        if(userv.ExistUser(user)) {
            response.getWriter().print("true");
        }
        else {
            response.getWriter().print("false");
        }
    }

对于js,JQuery,Ajax这些东西感觉自己都不懂，看着大概能猜出来是个什么意思，折腾了好久才搞好,也算是学习了。
@ResponseBody //将函数返回值作为请求返回值，没有这个注解的话，请求的响应应该是一个页面，不需要页面的话应该加上这个注解。
刚开始没有加注解，一直没有效果，各种找错，最后alert后发现xmlhttp.status一直是404，最后百度发现要加上@ResponseBody将函数返回值作为请求返回值，还有readyState是undfined相当于0其实是自己readyState单词写错了，智障。

XMLHTTP 的 readyState 值含义：

0－未初始化，即尚未调用 open。
1－初始化，即尚未调用 send。
2－发送数据，即已经调用 send。
3－数据传送中。
4－完成。