使用jquery ajax判断用户名是否存在后，如果做表单提交？

Question

各位大神好，我还没有学query，但在做练习的时候，需要判断用户名是否存在，于是尝试使用了下$.get()方法来获取action返回值。

用以下代码，我能正确获取到action的返回值。在使用返回值做判断也都是正常的，**但是在表单提交的时候**，无法正常的return，执行if的顺序也很奇怪

代码：

//检查用户名：不能为空，且不能重复
function checkUsername() {
    var username = document.getElementById("username").value;
    var username_message = document.getElementById("username_message");
    username_message.style.fontSize = "12px";

    //只需要判断是否为空，输入了内容会进行用户名存在的校验
    if (username == "" || username.length == 0) {
        username_message.style.color = "red";
        username_message.innerHTML = "请输入用户名";
        return false;
    }

    //如果用户输入了内容，那么使用ajax验证用户名是否已存在
    else{
        var actionMessage;
        // ajax获取到action的查询结果
        $.get("user_checkUsername.action?"+new Date().getTime(),{'username':username}, function(data){
            alert("in ajax data is: "+data);
            actionMessage = data;
            alert("in ajax actionMessage is: "+actionMessage);
            //本来是在这里面完成判断的，发现有问题后提取出去，问题还是在
        });

        if(actionMessage=="exist"){
            alert("if exist, actionMessage is: "+actionMessage);
            username_message.style.color = "red";
            username_message.innerHTML = "用户名已存在";

            return false;
        }
        else if(actionMessage=="ok") {
            alert("if ok, actionMessage is: "+actionMessage);
            username_message.style.color = "green";
            username_message.innerHTML = "用户名可以使用";

            return true;
        }
        else{
            alert("if neither, actionMessage is: "+ actionMessage);
            return false;
        }
    }
}

onblur失焦时会调用一次这个方法，然后提交表单时，也会调用一次。

问题：data的值是没问题的，不管失焦还是提交表单，alert的弹出顺序都是：

if neither, actionMessage is: undefined
in ajax data is: exist
in ajax actionMessage is: exist

然后就结束了。

请问为什么会出现这种现象？if else的顺序难道不是应该从上到下吗？况且执行完了第一个alert，alert("if neither, actionMessage is: "+ actionMessage);后的return貌似没有执行？

在线跪求答案。

Answer 1

ajax是异步的，就是请求的url还没返回内容就已经执行了下面的 if(actionMessage=="exist"){的代码了，由于默认undefined，所以顺序就是你贴出来的了，

用$.ajax配置async为false改为同步请求就行了

         $.ajax({url:"user_checkUsername.action?"+new Date().getTime(),data:{'username':username}, success:function(data){
            alert("in ajax data is: "+data);
            actionMessage = data;
            alert("in ajax actionMessage is: "+actionMessage);
            //本来是在这里面完成判断的，发现有问题后提取出去，问题还是在
        },
                async:false//////////////////////////////
                });