在ajax回调函数之外使用变量

Question

在回调函数之外使用全局变量的最佳方法是什么？

    var icon; 
    $(function(){

      $.get('data.xml', function(xml){

           icon = xml.documentElement.getElementsByTagName("icon");
           //this outputs a value
           console.log(icon);
       });
       //this is null
       //How can this maintain the value set above?
       console.log(icon);
    });

Answer 1

您提供的代码是完全有效的，并且实际上icon 可以 “保持”其价值。问题可能是get()异步运行的-仅 在
'data.xml'从服务器完全加载后才调用匿名函数。因此，现实世界中的执行顺序如下所示：

1. 调用get('data.xml', function(xml){...}) （开始加载data.xml）
2. 通话console.log(icon)（icon目前仍为null）
3. （data.xml中完成载入） 现在 匿名函数被调用时，其分配值给图标：icon = xml.documentElement.getElementsByTagName("icon")。

如果你想要做一些事情的价值icon， 之后 的“data.xml中”已被提取，那么你需要做的是 内部 匿名回调函数。像这样：

var icon; 
$(function(){

  $.get('data.xml', function(xml){
       icon = xml.documentElement.getElementsByTagName("icon");
       console.log(icon);
   });
});

祝好运！

注意：您仍然可以使用icon从代码， 外面 的匿名功能，但你需要等待来访问它，直到 后
匿名函数已经运行。最好的方法是将相关代码放入其自己的函数中，然后从回调函数中调用该函数：

var icon; 
$(function(){

  $.get('data.xml', function(xml){
       icon = xml.documentElement.getElementsByTagName("icon");
       loadIcon();
   });

   function loadIcon() {
       console.log(icon);
       // ... do whatever you need to do with icon here
   }
});