JavaScript/jQuery变量作用域问题与嵌套的.ajax()调用

JavaScript/jQuery变量作用域问题与嵌套的.ajax()调用,javascript,jquery,ajax,variables,scope,Javascript,Jquery,Ajax,Variables,Scope,我很难将变量postData传递给嵌套的子.ajax()调用,该变量是一个序列化的jQuery数组对象postData已成功传递给第一个.ajax()调用,但当我尝试在第二个.ajax()调用中使用它时,它不会发布任何表单元素,因为该级别的变量未定义: $(".myForm").submit(function () { var postData=$(this).serializeArray(); $.ajax({ type : "POST",

我很难将变量
postData
传递给嵌套的子
.ajax()
调用,该变量是一个序列化的jQuery数组对象
postData
已成功传递给第一个
.ajax()
调用,但当我尝试在第二个
.ajax()
调用中使用它时,它不会发布任何表单元素,因为该级别的变量未定义:

$(".myForm").submit(function () {
    var postData=$(this).serializeArray();
    $.ajax({
        type        : "POST",
        async       : false,
        cache       : false,
        url         : "./insertComment.php",
        data        : postData,
        success: function() {
            $.ajax({
               type         : "POST",
               async       : false,
               cache        : false,
               url          : "./getComments.php",
               data        : postData,
               success: function(comments) {
                   $(".Comments").html(comments);
               }
            });
        }
    });
    return false;
});
我尝试创建第二个变量
\u postData
尝试将该变量永久化到下一个
.ajax()
调用,但没有成功(也尝试了
var\u postData=$(this).parent().serializeArray();
,但我仍然无法永久化该变量):

我尝试实现所谓的JavaScript闭包(我仍然没有完全理解),但这导致了更多未定义的变量和更多的失败:

$(".myForm").submit(function () {
    var postData = function() {
        $(this).serializeArray();
    }();
    $.ajax({
        type        : "POST",
        async       : false,
        cache       : false,
        url         : "./insertComment.php",
        data        : postData,
        success: function() {
            $.ajax({
               type         : "POST",
               async       : false,
               cache        : false,
               url          : "./getComments.php",
               data        : postData,
               success: function(comments) {
                   $(".Comments").html(comments);
               }
            });
        }
    });
    return false;
});
我尝试四处搜索并尝试实现其他几种技术,包括jQuery遍历(
.parent()
.filter()
,等等),但没有成功。我知道这对很多人来说都是一个普遍的问题,但到目前为止,我还没有找到一个简单易懂的解决方案。如有任何建议,将不胜感激。谢谢

试试这个:

$(".myForm").submit(function () 
    {
        var postData=$(this).serializeArray();
        $.ajax({ type        : "POST",
                 async       : false,
                 cache       : false,
                 url         : "./insertComment.php",
                 data        : postData,
                 success: (function(pData) 
                   {
                      // capture the posted data in a closure
                      var _postData = pData;
                      return function() 
                             {                    
                               $.ajax({ type: "POST",
                                        async: false,
                                        cache: false,
                                        url: "./getComments.php",
                                        data: _postData,
                                        success: function(comments)
                                        {
                                            $(".Comments").html(comments);
                                        }
                                    });
                            }
                   })(postData)   // execute the outer function to produce the colsure
               });
      return false;
    });

下面是我最后做的:

$(".myForm").submit(function () {

    var postData = $(this).serializeArray(); // Gets all of the form elements
    var myID = $(this.ID).val(); // Takes only a single value from the form input named ID

    $.ajaxSetup({
        data        : "ID=" + myID // Sets the default data for all subsequent .ajax calls
    });

    $.ajax({
        type        : "POST",
        async       : false,
        cache       : false,
        url         : "./insertComment.php",
        data        : postData, // Overwrites the default form data for this one instance only, including all form elements
        success: function() {
            $.ajax({
               type         : "POST",
               async        : false,
               cache        : false,
               url          : "./loadComments.php", // Notice there is no data: field here as we are using the default as defined above
               success: function(comments) {
                   $(".Comments").html(comments);
               }
            });
        }
    });
    return false;
});

您的原始代码应该可以正常工作,我知道,这太奇怪了……您可能会认为后续的变量可以工作,但是当我检查第二个
.ajax()
调用Firebug生成的POST数据时,根本没有发布任何内容,
postData
在第二个
.ajax()中是一个未定义的变量
成功:
回调。作为一名黑客,我能够通过使用:
var postData=$(this.serializeArray();$)更改
.ajax()
设置。ajaxSetup({data:postData}).ajax()
调用都使用我在
.ajaxSetup()
中指定的数据。但这仍然是一个非常不完美的解决方案,因为我可能需要将不同的变量传递给第二个
.ajax()
调用。这不应该发生。你在别处有问题。仔细检查代码并使用调试器。
$(".myForm").submit(function () {

    var postData = $(this).serializeArray(); // Gets all of the form elements
    var myID = $(this.ID).val(); // Takes only a single value from the form input named ID

    $.ajaxSetup({
        data        : "ID=" + myID // Sets the default data for all subsequent .ajax calls
    });

    $.ajax({
        type        : "POST",
        async       : false,
        cache       : false,
        url         : "./insertComment.php",
        data        : postData, // Overwrites the default form data for this one instance only, including all form elements
        success: function() {
            $.ajax({
               type         : "POST",
               async        : false,
               cache        : false,
               url          : "./loadComments.php", // Notice there is no data: field here as we are using the default as defined above
               success: function(comments) {
                   $(".Comments").html(comments);
               }
            });
        }
    });
    return false;
});