從JSON獲取Gravatar Img

Question

我試圖解析將顯示用戶Gravatar圖像的數據。 JSON如下：http://api.bfhstats.com/api/playerInfo?plat=pc&name=stewartps&output=js在第34行是'uGava'，這是他們的gravatar URL。它應該是http://gravatar.com/+ uGava

目前我有一個表單，要求用戶輸入名稱並選擇一個平臺。

這是我對這些代碼：

$("#playerstuff").submit(function() { 
    $.ajax({ 
     type: "GET", 

     url: 'http://api.bfhstats.com/api/playerInfo?plat=' + document.getElementById("platform").value +'&name=' + document.getElementById("playername").value, 
     //datatype : "json", 

     success: function(data) 
     { 
      document.getElementById("playerrank").innerHTML = '<img src="http://gamingstats.ga/' +data["player"]["rank"].imgLarge + '" />'; 
          $("#formpanel").hide(); 
          $("#dataret").show(); 
          $("#playerimg").show(); 
     } 
    }); 
    return false; 
}); 

我也只是有一個標準的圖像

<div class="user-img-div" id="playerimg" style="display: none;" > 
<center><img src="img.png" class="img-circle"></center> 

</div> 

所以我的問題是如何將我使用該標準圖像來顯示來自JSO的用戶Gravatar N數據？

Answer 1

你得到的數據是普通的JS，而不是JSON。另外，如果對象屬性中沒有特殊字符，則不需要使用括號表示法。您的AJAX調用更改爲以下內容：

$("#playerstuff").submit(function(e){ 
    e.preventDefault(); 

    $.ajax({ 
     type: "GET", 
     url: 'http://api.bfhstats.com/api/playerInfo?plat=' + document.getElementById("platform").value +'&name=' + document.getElementById("playername").value, 
     // script data type 
     datatype: "script", 
     success: function(){ 
      var data = window.pd; 
      $("#playerrank").html('<img src="http://gamingstats.ga/' +data.player.rank.imgLarge+'"/>'); 
      $("#formpanel").hide(); 
      $("#dataret").show(); 
      // Use Gravatar as user image 
      $("#playerimg").attr('src', 'http://gravatar.com/'+data.player.uGava).show(); 
     } 
    }); 
}); 

另外，因爲它們的API不支持JSON，您可以更改output GET參數，使用這個代替：

$("#playerstuff").submit(function(e){ 
    e.preventDefault(); 

    $.ajax({ 
     type: "GET", 
     url: 'http://api.bfhstats.com/api/playerInfo?output=json&plat=' + document.getElementById("platform").value +'&name=' + document.getElementById("playername").value, 
     // script data type 
     datatype: "json", 
     success: function(data){ 
      $("#playerrank").html('<img src="http://gamingstats.ga/' +data.player.rank.imgLarge+'"/>'); 
      $("#formpanel").hide(); 
      $("#dataret").show(); 
      // Use Gravatar as user image 
      $("#playerimg").attr('src', 'http://gravatar.com/'+data.player.uGava).show(); 
     } 
    }); 
});