0

我有一个小的 jQuery/AJAX 脚本，用于检查用户名是否已在使用中。它查询一个 PHP 脚本，然后输出具有指定用户名的用户数。我有一个错误计数器来跟踪表单上验证错误的数量，如果用户名已经在使用中，我会增加计数器。

//Keep track of number of errors
 var errors = 0;
 //Keep track of error messages
 var errorMsg = "";

//Check if the passwords match (this part works as expected)
 if($("#password").val() != $("#repeat").val()) {
     errors++;
     errorMsg += "<li>Passwords do not match!</li>";
 }

     //Now check if the user exists
     var userName = $("#user").val();
    $.ajax({   
        type: "POST",
        data : {'user': userName},
        cache: false,  
        url: "js/ajax/addUser.php?action=checkuser",   
        success: function(data){
            var result = parseInt(data);
            //For debugging purposes
            alert("Before checking the data, # of errors is: " + errors);
            if(result > 0) {
                errors++;
                errorMsg += "<li>A user with the name <strong>" + userName + "</strong> already exists!</li>";
            }
            //For debugging purposes
            alert("After checking the data, # of errors is: " + errors);

        }
    });
    //For debugging purposes
    alert("Before validating the form, # of errors is: " + errors);

     if(errors > 0) {
         //Output error message
     }
     else {
         //Send the form
     }

正如评论中提到的，我有一些alert()用于调试的。前两个（在 AJAX 请求中）显示正确的错误数量。但是，当我到达第三个时，它完全忽略了 AJAX 请求中发生的任何错误。

我已将我的代码精简为基本要素，但如果在提供的代码段中错误不明确，我可以发布整个内容。

4

4 回答 4

2

ajax 是异步的。把你的逻辑放在成功里面。

//Keep track of number of errors
 var errors = 0;
 //Keep track of error messages
 var errorMsg = "";

//Check if the passwords match (this part works as expected)
 if($("#password").val() != $("#repeat").val()) {
     errors++;
     errorMsg += "<li>Passwords do not match!</li>";
 }

     //Now check if the user exists
     var userName = $("#user").val();
    $.ajax({   
        type: "POST",
        data : {'user': userName},
        cache: false,  
        url: "js/ajax/addUser.php?action=checkuser",   
        success: function(data){
            var result = parseInt(data);
            //For debugging purposes
            alert("Before checking the data, # of errors is: " + errors);
            if(result > 0) {
                errors++;
                errorMsg += "<li>A user with the name <strong>" + userName + "</strong> already exists!</li>";
            }
            //For debugging purposes
            alert("After checking the data, # of errors is: " + errors);

            if(errors > 0) {
                //Output error message
            }
            else {
                //Send the form
            }
        }
    });
    //For debugging purposes
    alert("Before validating the form, # of errors is: " + errors);
于 2012-11-28T19:30:10.220 回答
2

ajax 请求的回调函数是异步执行的。因此，紧接在此请求之后的代码可能会在调用返回之前执行。

于 2012-11-28T19:30:52.737 回答
1

据我了解，问题在于 AJAX 调用的方式。第三次警报

alert("Before validating the form, # of errors is: " + errors);

与您进行的 $.ajax 调用同时调用。

由于您的意图是同步调用调用，您可能希望使用 jquery Defered Object链接调用

如果您正在当前代码中寻找解决方案，则需要将以下代码移动到成功处理程序中。

alert("Before validating the form, # of errors is: " + errors);

     if(errors > 0) {
         //Output error message
     }
     else {
         //Send the form
     }
于 2012-11-28T19:38:27.880 回答
0

您可以将async:false添加到您的函数中，一切都会为您工作。

type: "POST",
async:false
于 2014-02-08T12:09:56.053 回答