无法在AJAX成功之外访问JSON对象 [英] Unable to access JSON object outside of AJAX success

问题描述

我在AJAX成功范围之外使用JSON对象时遇到麻烦.我需要访问AJAX成功范围之外的返回的JSON对象.我尝试在AJAX范围之外初始化JS var并将JSON分配给它.但是，此方法导致catalog.item is undefined错误.感谢您提出的任何建议，可以帮助我解决此问题.

I am having trouble using a JSON object outside of the AJAX success scope. I need to access the returned JSON object outside the AJAX success scope. I tried initializing a JS var outside the AJAX scope however and the assigning the JSON to it. However, this approach results in a catalog.item is undefined error. I appreciate any suggestions that will help me fix this problem.

这是我尝试过的:

这种方法可以很好地工作(但不是我所需要的):

This approach works perfectly fine (but not what I need):

            $('.catViewButton').click(function(){
                var overlay = jQuery('<div class="overlay"> </div>');
                overlay.appendTo(".invoice-body");
                $('.catalog-view-wrapper').show();
                $.ajax({
                    url: "ajax/invoice-get-data.php?loadCatalog=1",
                    dataType: "json",
                    success: function(catalog){
                        alert(catalog.item[0].image);
                         $('.catalog-img-container').attr("src", catalog.item[0].image);
                    }
                }); 

                        ...more code
                        .....
                        .....

这种方法是我所需要的，但是会导致错误:

This approach is what I need but results in an error:

        var catalog = [];
        $('.catViewButton').click(function(){
            var overlay = jQuery('<div class="overlay"> </div>');
            overlay.appendTo(".invoice-body");
            $('.catalog-view-wrapper').show();
            $.ajax({
                url: "ajax/invoice-get-data.php?loadCatalog=1",
                dataType: "json",
                success: function(cat){
                    catalog = cat;
                }
            }); 
            alert(catalog.item[0].image);
            $('.catalog-img-container').attr("src", catalog.item[0].image);
                    ...more code
                    .....
                    .....

非常感谢！

推荐答案

您可以使用推迟对象为您处理异步调用.这样，无论何时返回响应，您的代码都将按读取顺序执行.您可以根据需要添加任意数量的回调:

You could use the Deferred Object which deals with asynchronous calls for you. Doing so your code will be executed in the reading order, no matter when the response is sent back. You can add as many callback as you need :

jqxhr = $.ajax({
    url: "ajax/invoice-get-data.php?loadCatalog=1",
    dataType: "json"
}); 
jqxhr.done(function(catalog) { 
    alert(catalog.item[0].image);
    $('.catalog-img-container').attr("src", catalog.item[0].image);
});
jqxhr.done(function(catalog) { 
    // use catalog again
});

文档中包含有关所有上述内容的所有示例: http://api.jquery.com/jQuery.ajax/.

The documentation is full of examples about all of that : http://api.jquery.com/jQuery.ajax/.

这篇关于无法在AJAX成功之外访问JSON对象的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！