Javascript 在jQuery中完成多个函数，这些函数可能在内部调用ajax，也可能不调用ajax？

我目前正在验证客户端的一些输入。当用户提交表单时，我希望检查表单输入的值，然后在所有检查完成后执行一些操作

$('form').submit(function() {
    var input1 = $('form #input1');
    var input2 = $('form #input2');

    //validate both input values
    validate_input(input1);
    validate_input(input2);

    //wait until all validation complete to execute code here

    return false;
});

这里，“验证输入”功能将检查输入值。如果它通过了初始检查（如字符长度），那么它将发出一个AJAX请求以进行进一步验证（例如，检查是否使用用户名）。大概是这样的：

function validate_input(input){
    value=input.val();
    if (value.length<4){
        //code to execute if input is too short
    }
    else {
        $.ajax({             
            type: 'get',
            url: check_input_url,
            data: input.serialize(),
            success: function(data){
                if (data=="invalid") {
                    //code to execute if invalid
                } else {
                    //code to execute if valid
                }
            }
        });
    }
}

---

在执行进一步的代码之前，我如何等待所有的validate_输入函数都完成（使用任何可能的AJAX回调完成）？

更新：我刚刚更新了答案。现在它更有可能满足您的需求。我在回调函数中添加了一个参数

将回调与匿名函数一起使用并链接它们：

1。为回调函数和回调函数调用添加一个参数：

function validate_input(input, callback){
    value=input.val();
    if (value.length<4){
        //code to execute if input is too short
        callback(false);
    }
    else {
        $.ajax({             
            type: 'get',
            url: check_input_url,
            data: input.serialize(),
            success: function(data){
                if (data=="invalid") {
                    //code to execute if invalid
                    callback(false);
                } else {
                    //code to execute if valid
                    callback(true);
                }
            }
        });
    }
}

---

我看不到您

验证\u输入

函数返回任何内容。如果要等待，则需要返回一个承诺，这样就不会将

未定义的
传递给
$。when（）
：

功能验证\u输入（输入）{
var value=input.val（）；
如果（value.length）就是这样，我没有返回ajax对象！
function validate_input(input, callback){
    value=input.val();
    if (value.length<4){
        //code to execute if input is too short
        callback(false);
    }
    else {
        $.ajax({             
            type: 'get',
            url: check_input_url,
            data: input.serialize(),
            success: function(data){
                if (data=="invalid") {
                    //code to execute if invalid
                    callback(false);
                } else {
                    //code to execute if valid
                    callback(true);
                }
            }
        });
    }
}

$('form').submit(function() {
    var input1 = $('form #input1');
    var input2 = $('form #input2');

    //validate both input values
    validate_input(input1, function(result){
        if(result == true)
        {
             validate_input(input2, function(result){
                 if(result == true)
                 {
                    //wait until all validation complete to execute code here
                 }
                 else
                 {
                    return false;
                 }
             });
        }
        else
        {
            return false;
        }
    });
});

function validate_input(input){
    var value=input.val();
    if (value.length<4){
        return …; //code to execute if input is too short
    } else {
        return $.ajax({
 //     ^^^^^^
            …
        });
    }
}

var inputsLength = 0, // or maybe set it to $('form input').length
    inputsReady = 0;
function checkInputsValidation(){
    if (++inputsReady === inputsLength) YOURSALLINPUTSAREVALIDFUNCTION();
}
function validate_input(input){
    inputsLength++; // remove it if you already set inputsLength
    // blablabla
    $.ajax({             
        type: 'get',
        url: check_input_url,
        data: input.serialize(),
        success: function(data){
            if (data=="invalid") {
                //code to execute if invalid
            } else {
                checkInputsValidation();
            }
        }
    });
}