为什么这些AJAX调用没有更新我的变量?

时间:2016-04-15 17:57:48

标签: javascript jquery ajax

我准备好以下变量来保存从API调用返回的字符串:

  // Variables for the Twitch user's object
  var tName = "tName";
  var tLogo = "tLogo";
  var tGame = "tGame";
  var tChannel = "tChannel";

然后我有这个函数,它持有一个AJAX调用:

    function twitchInfo(user){
$.ajax({
  url: streams + user,
  success: function(response){
    if (response.stream){
      tName = response.stream.channel.display_name;
      tLogo = response.stream.channel.logo;
      tGame = response.stream.game;
      tChannel = response.stream.channel.status;
    } else {
      $.ajax({
        url: users + user,
        success: function(data){
          tName = data.display_name;
          if (data.logo) {
            tLogo = data.logo} else {tLogo = defLogo}
          tGame = "Offline";
          tChannel = " ";
        }
      })
    };        
  }
})
};

从循环中调用该函数,该循环遍历用户数组。

我检查了通话网址,他们都返回数据就好了。

我希望来自ajax调用的数据更新变量,但是在通过执行console.log(tName + tLogo ....)进行调查时,没有任何内容正在更新。

任何人都能发现原因吗?任何想法都将不胜感激。

由于

修改

  $(document).ready(function() {

  //the Twitch accounts to include:
  var twitchUsers = ["OgamingSC2", "ESL_SC2", "FreeCodeCamp", "storbeck", "brunofin", "comster404", "lastUser"];
  var defLogo = "https://cdn1.iconfinder.com/data/icons/user-experience/512/user-unknown-512.png";

  //Beginning of API call
  var streams = "https://api.twitch.tv/kraken/streams/";
  var users = "https://api.twitch.tv/kraken/users/";

 //Twitch user's object which will hold the info from the API calls.
 var AccInfo=  {};

 // Variables for the Twitch user's object
 var tName = "tName";
 var tLogo = "tLogo";
 var tGame = "tGame";
 var tChannel = "tChannel";

 //Object constructor
 function twitchUser(name, logo, game, channel){
 this.name = name;
 this.logo = logo;
 this.game = game;
 this.channel = channel;
 }

 function twitchInfo(user){
 $.ajax({
 url: streams + user,
  success: function(response){
    if (response.stream){
      tName = response.stream.channel.display_name;
      tLogo = response.stream.channel.logo;
      tGame = response.stream.game;
      tChannel = response.stream.channel.status;
    } else {
      $.ajax({
        url: users + user,
        success: function(data){
          tName = data.display_name;
          if (data.logo) {
            tLogo = data.logo} else {tLogo = defLogo}
          tGame = "Offline";
          tChannel = " ";
        }
      })
    };        
    }
    })
    };

   for (p=0; p<twitchUsers.length; p++){
   twitchInfo(twitchUsers[p]);

$("#theTable").append("<tr><td class=\"theLogo\"><img src=" + AccInfo.logo + "></td><td class=\"user\"><a href=\"http://www.twitch.tv/" + AccInfo.name + "\">"+ AccInfo.name +"</td><td>"+ AccInfo.game + " " + AccInfo.channel + "</td></tr>");

console.log(twitchUsers[p] + " " + tName + " " + tLogo + " " + tGame + " " + tChannel + " ");
  }



 });

1 个答案:

答案 0 :(得分:0)

这些变量在哪里宣布? 也许他们超出了范围。你能提供更完整的样品吗?

您也可以尝试将回调传递给twitchInfo函数。因此,您只需将回调分配给success属性,而不是更新方法中的变量:

twitchInfo("some user", function(response) {
    if (response.stream){
          tName = response.stream.channel.display_name;
          tLogo = response.stream.channel.logo;
          tGame = response.stream.game;
          tChannel = response.stream.channel.status;
        } else {
          $.ajax({
            url: users + user,
            success: function(data){
              tName = data.display_name;
              if (data.logo) {
                tLogo = data.logo} else {tLogo = defLogo}
              tGame = "Offline";
              tChannel = " ";
            }
          })
     }
 );

当你调用函数时,只需创建一个内联函数,确保你想要更新的变量在范围内:

{{1}}