ajax完成后执行window.location重定向 - Execute window.location redirect AFTER ajax is complete

总之，我有一个通过AJAX加载的表单。此表单的必填字段通过另一个AJAX调用进行检查。填写完所有必填字段后，将向数据库添加一条新记录，用户现在应该被发送到我的支付页面，以完成申请流程。我已经尝试添加window.location = "http://www.paymentPage.php";，但无论我把这些代码放在哪里，它都会和我的ajax代码一起执行。我甚至尝试在validMA.php中的代码末尾添加一个die(header:location('paymentPage.php'));。我知道我缺少了一些简单的东西。。。就是想不通。

PHP代码：

<?php 
session_start();
include('header.htm');?>
</head> 
<body> 
<div id="container">
   <div id="content"><div class="content">
      <h1>New Member Application</h1>
   <form method="post" name="checkUserMA" id="checkUserMA">
    <label class="clear" style="width:120px">Username/Email<br><span class="small"></span></label>
    <input type="text" name="usernameMA" id="usernameMA" class="green" style="width:300px;"/><br><br>
    <input type="submit" id="checkUserMA" class="submit" value="Submit" />
</form>
    <div id="errorMA"></div>
    <div id="resultMA"></div>
    </div></div><!--end content-->  
<div id="footer">
<?php include("footer.htm") ?>
<!--<?php include("disclaimer.htm") ?>-->
</div><!--end footer-->
<div class="clear"></div>
</div><!--end container-->
<div class="clear"></div>
</body> 
</html>

JS代码：

$(document).ready(function() {
    //NEW MEMBER APPLICATION
    $('#resultMA').hide();
    $('#errorMA').hide();
    $("#checkUserMA").submit(function(event){
        event.preventDefault();
        $("#resultMA").html('');
        var values = $(this).serialize();
        $.ajax({
            url: "checkMA.php",
            type: "post",
            data: values,
            success: function(result){
                $("#resultMA").html(result).fadeIn();
                $('.error').hide();
                validMA();
                window.location = "http://184.154.174.162/~nsgpcom/memberAppPay.php";
            },
            error:function(){
               $("#resultMA").html('There was an error.').fadeIn();
            }
        });//end ajax
    });
function validMA(){
    $("#fullFormMA").click(function(e){
        e.preventDefault();
        $("#errorMA").html('');
        var fullForm = $(this).serialize();
        $.ajax({
            url: "validMA.php",
            type: "post",
            data: fullForm,
            success: function(result){
                $("#errorMA").html(result).fadeIn();
            },
            error:function(){
               $("#errorMA").html('There was an error.  Please try again.').fadeIn();
            }
        });//end 
    });
    $("errorMA").hide();
}//end function

validMA.php代码：

<?php
session_start();
include('functions.php');
connect();
$firstName = protect($_POST['firstName']); 
$lastName = protect($_POST['lastName']);
$address1 = protect($_POST['address1']);
$address2 = protect($_POST['address2']);
$city = protect($_POST['city']);
$state = protect(strtoupper($_POST['state']));
$zip = protect($_POST['zip']);
$required = array('firstName','lastName','address1','city','state','zip');
    // Loop over field names, make sure each one exists and is not empty
$error = false;
foreach($required as $field) {
  if (empty($_POST[$field])) {
    $error = true;
  }
}
if ($error){
    echo "You need to fill in all required (*) fields";
} else {
    $sql2 = "INSERT INTO newMembers (username,firstName,lastName,address1,address2,city,state,zip,publicEmail,workPhone,privateAddress1,privateAddress2,privateCity,privateState,privateZip,homePhone,cellPhone,website,facebook,twitter,linkedIn,education,licensure,certification,statement,dateAdded) VALUES ('$username','$firstName','$lastName','$address1','$address2','$city','$state','$zip','$publicEmail','$workPhone','$privateAddress1','$privateAddress2','$privateCity','$privateState','$privateZip','$homePhone','$cellPhone','$website','$facebook','$twitter','$linkedIn','$education','$licensure','$certification','$statement','$dateAdded')";
    $result2 = mysql_query($sql2) or die(mysql_error());
}?>

希望理解这个逻辑。我知道我会一次又一次地使用它。

您的window.location = ...应该在validMA函数内

function validMA(){
    $("#fullFormMA").click(function(e){
        e.preventDefault();
        $("#errorMA").html('');
        var fullForm = $(this).serialize();
        $.ajax({
            url: "validMA.php",
            type: "post",
            data: fullForm,
            success: function(result){
                $("#errorMA").html(result).fadeIn();
                /* ====
                 * HERE YOU PLACE IT
                 * ====
                 */
                window.location = "http://184.154.174.162/~nsgpcom/memberAppPay.php";

            },
            error:function(){
               $("#errorMA").html('There was an error.  Please try again.').fadeIn();
            }
        });//end 
    });
    $("errorMA").hide();
}//end function

您有

validMA();
window.location = "http://184.154.174.162/~nsgpcom/memberAppPay.php";

但是我的window.location进入了有效的MA（）；

success: function(result){
            $("#errorMA").html(result).fadeIn();
            window.location = "http://184.154.174.162/~nsgpcom/memberAppPay.php";
        },

在这里！

我使用上述建议的问题是，在所有验证完成之前，用户被重定向到支付页面。。。实际上是在第一次提交表格时。我在validMA.php代码的底部添加了以下代码（在if/else循环的成功部分）。

if ($error){
    echo "You need to fill in all required (*) fields";
} else {
    $sql2 = "INSERT INTO newMembers (username,firstName,lastName,address1,address2,city,state.....)";
    $result2 = mysql_query($sql2) or die(mysql_error());?>
    <script type="text/javascript">
        alert('You completed step 1');
        window.location.href = "http://www.paymentPage.php";
    </script>
<?php
}?>

我觉得它没有想象中那么优雅，但它确实有效。谢谢大家的建议。

使用

window.location.href="your URL"

而不是

window.location