jQuery 将ajax数据存储到全局变量中

Store ajax data into a global variable

提问by Alex G

Continuing with JQuery - Storing ajax response into global variable

继续使用JQuery - 将 ajax 响应存储到全局变量中

Accepted solution somehow does not work for me.

以某种方式接受的解决方案对我不起作用。

$(document).ready(function() {
    var dataStore = (function(){
        var xml;

        $.ajax({
          type: "GET",
          url: "/?do=getcontentadm1n&category=homepage",
          dataType: "json",
          success : function(data) {
                        xml = data.html;
                alert(xml); // WORKS
                    }
        });

        return {getXml : function()
        {
            if (xml) return xml;
        }};
    })();

    var somevar = dataStore.getXml();

    alert(somevar); // UNDEFINED
});

Is there other solution?

还有其他解决方案吗？

Thanks.

谢谢。

回答by driangle

It's empty because by the time getXmlis called, the ajax request has not completed, remember ajax is asynchronous. One way to get around it is to force it to be synchronous:

它是空的，因为到getXml调用的时候，ajax 请求还没有完成，记住ajax 是异步的。绕过它的一种方法是强制它是同步的：

       $.ajax({
          async: false,
          type: "GET",
          url: "/?do=getcontentadm1n&category=homepage",
          dataType: "json",
          success : function(data) {
                        xml = data.html;
                alert(xml); // WORKS
                    }
        });

Responding to comment:

回复评论：

I want perform AJAX onclick, then store data.html for other mouse events

我想执行 AJAX onclick，然后为其他鼠标事件存储 data.html

var dataStore = (function(){
    var html;
    function load(){
           $.ajax({
              async: false,
              type: "GET",
              url: "/?do=getcontentadm1n&category=homepage",
              dataType: "json",
              success : function(data) { html = data.html; }
            });
    }
    return {
        load : function() { 
            if(html) return;
            load();
        },
        getHtml: function(){
             if(!html) load();
             return html;
        }
    }
})();

$(element1).click(function(){
    dataStore.load();
});

$(element2).click(function(){
    var html = dataStore.getHtml();
    // use html
});

回答by ozczecho

The ajax call is async. It probably hasnt finished running when you call:

ajax 调用是异步的。当您调用时，它可能还没有完成运行：

var somevar = dataStore.getXml();

回答by Cariah

Alright this is my first Reply but here it goes.

好吧，这是我的第一次回复，但它就在这里。

I've been bashing my head against this issue myself and learned this.

我自己一直在抨击这个问题并学到了这一点。

When you define a variable outside a function, it is automaticly added to the 'window' object.

当您在函数外部定义变量时，它会自动添加到“window”对象中。

so if we do this:

所以如果我们这样做：

    var myValue;
    function setValue()
    {
        myValue = "test";
    }
    // Assuming setValue() has been run
    function getValue()
    {
        alert(window.myValue); // yup, it's "test"
    }

So if we use this knowledge to store $.ajax data in a variable it will go like this.

因此，如果我们使用这些知识将 $.ajax 数据存储在变量中，它将像这样。

    var xml;

    $.ajax({
        type: "GET",
        url: "/?do=getcontentadm1n&category=homepage",
        dataType: "json",
        success : function(data) {
            window.xml = data;
        }
    });

    alert(window.xml);

I think this will clear up quite alot for many people and get you to your answer. Thanks for reading my reply and the source: http://snook.ca/archives/javascript/global_variable

我认为这会让很多人明白很多，让你得到答案。感谢您阅读我的回复和来源：http: //snook.ca/archives/javascript/global_variable

EDIT: As mentioned in the comment below, this only works when async = false.

编辑：正如在下面的评论中提到的，这只适用于async = false.

回答by Mohammad Mahdi KouchakYazdi

Just use a 'async:false'Ajax and don't user varkeyword for making Global response.

只需使用'async:false'Ajax 而不要使用var关键字来进行全局响应。

回答by Alex G

@ggreiner: Forget about using functions in variables. You are confusing other users.

@ggreiner：忘记在变量中使用函数。你让其他用户感到困惑。

I'm a little angry, but nothing personal, there are NO solutions on Internet available to store AJAX data in the vars and use them in events.

我有点生气，但不是针对个人的，Internet 上没有可用于将 AJAX 数据存储在变量中并在事件中使用它们的解决方案。

NO NEED TO USE ANY FUNCTIONS IN VARIABLES like var dataStore = (function(){. This will call additional servers requests everytime you need data.

无需在诸如 var dataStore = (function(){ 之类的变量中使用任何函数。这将在您每次需要数据时调用额外的服务器请求。

Here is the code for calling ajax ONCE and use it's data for any other events, functions. That was the MAIN CONCERT of 99% users asking for this

这是调用 ajax ONCE 并将其数据用于任何其他事件、函数的代码。那是 99% 用户要求的主音乐会

$(document).ready(function() {
    var html; // DEFINE VARS
    var css;
    var js;

    $('.editbutton').live('click', function() {
        $.ajax({
            async   : false, // !!!MAKE SURE THIS ONE IS SET!!!
            type    : "GET",
            url : "/?do=getcontent",
            data    : { category: category },
            dataType: 'json',
            success : function(data) {
                if (data.status == 'ok') {
                                html = data.html; // !!!STORE!!!
                                css = data.css;  // !!!STORE!!!
                                js = data.js;  // !!!STORE!!!
                }
                if (data.status == 'error') {
                    alert('ERROR!');
                }
            }
        });
    });

    // CALL ANY STORED VARIABLE FROM ANYWHERE

    $('.otherbutton').live('click', function() {
        alert(html); alert(css); alert(js);
    });

});