Jquery AJAX在验证后不提交表单

下面是我的js验证代码和表单提交事件

问题是，当我提交表单时，它会验证用户id和名称，并且不会继续。但是如果我删除登录id验证，那么它只检查用户名并正确提交表单

Firebug显示它正在验证登录id，并停止了之前的任何操作。若登录id可用，我从数据库中得到“0”响应

$(document).ready(function () {

    var value = $('#button input').val();
    var name = $('#button input').attr('name');

    $('#button input').remove();
    $('#button').html('<a href="#" class="cssSubmitButton" rel=' + name + '>' + value + '</a>');

    //global vars
    var form = $("#customForm");
    var name = $("#name");
    var nameInfo = $("#nameInfo");
    var login_id = $("#login_id");
    var login_idInfo = $("#login_idInfo");

    //On blur
    name.blur(validateName);
    login_id.blur(validatelogin_id);

    //On key press
    name.keyup(validateName);
    login_id.keyup(validatelogin_id);

    //On Submitting
    $('#button a').on('click', function () {

        var link = $(this);
        if (validateName() & validatelogin_id()) //it validates login id here and gets stuck; if i remove validatelogin_id() it processes the form perfectly
        {
            var str = $("form").serializeArray();

            $.ajax({
                url: 'load.php',
                data: str,
                type: 'POST',
                cache: 'false',
                beforeSend: function () {
                    link.addClass('loading');
                },
                success: function (data) {
                    link.removeClass('loading');
                    $('#button').css('display', 'none');
                    $('#success').css('display', 'block');

                },
                error: function (x, e) {

                }
            });

            return true
        } else {
            return false;
        }
    });

    //validation functions
    function validatelogin_id() {
        //if it's NOT valid
        if (login_id.val().length < 4) {
            $('#login_id_correct').css('display', 'none');
            login_id.addClass("error");
            login_idInfo.text("We want names with more than 3 letters!");
            login_idInfo.addClass("error");
            return false;
        }
        //if it's valid
        else {

            $.ajax({
                type: "post",
                url: "./include/check_user_name.php",
                data: "username=" + login_id.val(),
                success: function (data) {
                    if (data == 0) {
                        $('#login_id_correct').css('display', 'block');
                        login_id.removeClass("error");
                        login_idInfo.text("What's your name?");
                        login_idInfo.removeClass("error");
                        return true;
                    } else {
                        $('#login_id_correct').css('display', 'none');
                        login_id.addClass("error");
                        login_idInfo.text("Username already used!");
                        login_idInfo.addClass("error");
                        return false;

                    }
                }
            });
        }
    }

    function validateName() {
        //if it's NOT valid
        if (name.val().length < 4) {
            name.addClass("error");
            nameInfo.text("We want names with more than 3 letters!");
            nameInfo.addClass("error");
            return false;
        }
        //if it's valid
        else {
            name.removeClass("error");
            nameInfo.text("What's your name?");
            nameInfo.removeClass("error");
            return true;
        }
    }
});

$（文档）.ready（函数（）{
var值=$（“#按钮输入”）.val（）；
变量名称=$（“#按钮输入”）.attr（'name'）；
$（“#按钮输入”）.remove（）；
$（“#按钮”）.html（“”）；
//全局变量
变量形式=$（“#自定义形式”）；
变量名称=$（“#名称”）；
变量名称信息=$（“#名称信息”）；
var login_id=$（“#login_id”）；
var login_idInfo=$（“#login_idInfo”）；
//关于模糊
name.blur（validateName）；
登录id.blur（验证登录id）；
//按键
name.keyup（validateName）；
登录id.keyup（验证登录id）；
//提交时
$（'#按钮a'）。在（'单击'，函数（）{
var-link=$（这个）；
if（validateName（）&validatelogin_id（））//它在这里验证登录id并卡住；如果我删除validatelogin_id（），它将完美地处理表单
{
var str=$（“form”）.serializeArray（）；
$.ajax({
url:'load.php'，
数据：str，
键入：“POST”，
缓存：“false”，
beforeSend:函数（）{
link.addClass（“加载”）；
},
成功：功能（数据）{
link.removeClass（“加载”）；
$（'按钮'）.css（'显示'，'无'）；
$（'#success'）.css（'display'，'block'）；
},
错误：函数（x，e）{
}
});
返回真值
}否则{
返回false；
}
});
//验证函数
函数validatelogin_id（）{
//如果它是无效的
if（login_id.val（）.length<4）{
$（'login'u id'u correct'）.css（'display'，'none'）；
登录id.addClass（“错误”）；
login_idInfo.text（“我们希望名称包含3个以上的字母！”）；
login_idInfo.addClass（“错误”）；
返回false；
}
//如果有效的话
否则{
$.ajax({
类型：“post”，
url:“./include/check\u user\u name.php”，
数据：“username=“+login_id.val（），
成功：功能（数据）{
如果（数据==0）{
$（'#login_id_correct'）.css（'display'，'block'）；
登录id.removeClass（“错误”）；
login_idInfo.text（“你叫什么名字？”）；
login_idInfo.removeClass（“错误”）；
返回true；
}否则{
$（'login'u id'u correct'）.css（'display'，'none'）；
登录id.addClass（“错误”）；
login_idInfo.text（“用户名已被使用！”）；
login_idInfo.addClass（“错误”）；
返回false；
}
}
});
}
}
函数validateName（）{
//如果它是无效的
if（name.val（）.length<4）{
name.addClass（“错误”）；
text（“我们希望名称包含3个以上的字母！”）；
nameInfo.addClass（“错误”）；
返回false；
}
//如果有效的话
否则{
name.removeClass（“错误”）；
text（“你叫什么名字？”）；
nameInfo.removeClass（“错误”）；
返回true；
}
}
});

假设您在onblur事件上调用

validatelogin\u id（）

，则此解决方案有效

valid_id = false; //declare a global flag

function validatelogin_id() {
        if (login_id.val().length < 4) {
            $('#login_id_correct').css('display', 'none');
            login_id.addClass("error");
            login_idInfo.text("We want names with more than 3 letters!");
            login_idInfo.addClass("error");
            valid_id = false; //set value of global flag           
        }
        else {

            $.ajax({
                type: "post",
                url: "./include/check_user_name.php",
                data: "username=" + login_id.val(),
                success: function (data) {
                    if (data == 0) {
                        $('#login_id_correct').css('display', 'block');
                        login_id.removeClass("error");
                        login_idInfo.text("What's your name?");
                        login_idInfo.removeClass("error");
                        valid_id = true; //set value of global flag
                    } else {
                        $('#login_id_correct').css('display', 'none');
                        login_id.addClass("error");
                        login_idInfo.text("Username already used!");
                        login_idInfo.addClass("error");
                        valid_id = false; //set value of global flag
                    }
                }
            });
        }
    }

到

---

您正在使用ajax验证登录id，但函数执行不会等待ajax调用返回，它将进行ajax调用，然后从

else

子句中不返回任何内容

验证登录id

返回什么？因为该函数中的AJAX请求是异步的，并且是函数本身，所以函数可能永远不会返回

true

@anu，那么在这种情况下可能的解决方案是什么呢。我非常希望在表单提交期间检查登录id和其他值。您已经在验证登录id onkeyup和onblur事件，因此您可以做的是声明一个全局变量，并在

validatelogin\u id（）中将其值设置为true或false

函数，然后在提交时检查此变量的值，不要再次调用

验证登录id（）time@putvande我得到“0”在firebug中，我假设它返回true。这里的一个问题是，当我单击表单提交时，如果我没有在登录id中输入任何内容。它不会提交表单，但也不会显示登录id未输入或无效……简言之，我应该如何调用validatelogin_id（）函数以突出显示错误消息。为此，您可以调用
validatelogin\u id（）
作为验证前的第一行，或者在该输入元素上触发模糊事件
if (validateName() & validatelogin_id())

if (validateName() & valid_id)