異步校驗用戶名的實現

今天是2016.8.26，作爲一名算不上剛入門的程序員，我開始寫我人生中的第一篇博客，博客的內容呢是關於實現異步用戶名校驗。很多人都知道，在我們做登錄操作的時候需要對用戶名進行驗證，爲了減輕數據庫的負擔，我們在每次輸入完用戶名時就對這個用戶名進行異步檢驗操作。

大致代碼如下：
//用戶名異步請求代碼（ajsx實現）
function checkUsername(obj){
            //要異步請求處理
            //1.要創建異步請求對象：XMLHttpRequest
            var xmlReq = new XMLHttpRequest();

            //2.設置請求數據
            xmlReq.open("GET","ajaxControl.jsp?username="+obj.value,true);
            var param = null;   //get方式沒有參數

            /*xmlReq.open("POST","ajaxControl.jsp",true);
            xmlReq.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
            var param = "username=" + obj.value; //post方式傳遞數據  

            //3.設置異常響應數據處理
            xmlReq.onreadystatechange = function(){
                //xmlReq.readyState : 0(創建異步請求對象) 1(異步請求初始化) 2(發送異步請求準備) 3(發送異步請求) 4(響應完成)
                if(xmlReq.readyState == 4){ //是否完成響應
                    if(xmlReq.status == 200){   //響應是否是成功的 200 OK
                        //var test = xmlReq.responseText;   //接收響應的文本數據
                        //alert(test.trim());
                        //var xml = xmlReq.responseXML; //接收響應的XML數據

                        var json = $.parseJSON(xmlReq.responseText.trim());

                        if(json.isCheck){
                            $("#userinfo").html("<img src='images/fail.png'/>用戶名已存在");//針對用戶名後面的檢測span標籤
                            $("#userinfo").css("color","red");
                        }else{
                            $("#userinfo").html("<img src='images/right.png'/>用戶名可以使用");
                            $("#userinfo").css("color","green");
                        }
                    }
                }
            };

            //4.發送請求
            xmlReq.send(param);

=========================================
//當然了，更簡單的驗證方法可以利用jQuery框架去實現
    function checkUsername(obj){
            //使用jQuery框架
            //第一個參數：異步請求地址
            //第二個參數：異步請求的請求參數
            //第三個參數：異步請求響應數據處理的回調處理， data參數就是響應的數據
            //第四個參數：異步請求響應數據的類型
            $.post("ajaxControl.jsp","username=" +obj.value,function(data){
                if(data.isCheck){
                    $("#userinfo").html("<img src='images/fail.png'/>用戶名已存在");
                    $("#userinfo").css("color","red");
                }else{
                    $("#userinfo").html("<img src='images/right.png'/>用戶名可以使用");
                    $("#userinfo").css("color","green");
                }
            },"json");

        }

//用jQuery框架去實現的代碼量大大減少，執行的結果也是一樣的

處理代碼
    //處理異步請求
    request.setCharacterEncoding("utf-8");
    String name = request.getParameter("username");
    //System.out.println("name ==>" + name);
    //out.print("我是異步響應！！！");