與jQuery消費Web服務

Question

我想運行下面的代碼，但沒有任何反應。

我在開發人員選項中沒有收到Firefox/Chrome上的任何錯誤消息。

任何想法我做錯了什麼？

$(document).ready(function() { 

    jQuery.support.cors = true; 

    var AltCoin = "ripple"; 
    //var api_url = "https://api.coinmarketcap.com/v1/ticker/" + AltCoin; 
    var api_url = "https://api.coinmarketcap.com/v1/ticker/"; 

    $.ajax({ 
     method: "GET", 
     dataType: "jsonp", 
     url: api_url, 
     data: AltCoin, 
     success: function(data) { 
      try {         
       $('#coin_value').html(data); 
      } 
      catch (error) { 
       alert('error found');         
      } 
     } 
    }); 
}); 

<article class="article"> 
    <h1>Ripple</h1> 
    <p id="coin_value">test</p> 
    <p></p> 
    <p><strong></strong></p> 
</article> 

該腳本是非常基本的。

Answer 1

問題是因爲您調用的API以JSON格式返回數據，而不是JSONP。它們不可互換。

要解決該問題，請將dataType: 'jsonp'更改爲dataType: 'json'。試試這個：

var AltCoin = "ripple"; 
 
var api_url = "https://api.coinmarketcap.com/v1/ticker/"; 
 

 
$.ajax({ 
 
    method: "GET", 
 
    dataType: "JSON", 
 
    data: AltCoin, 
 
    url: api_url, 
 
    success: function(data) { 
 
    console.log(data); 
 
    //$('#coin_value').html(data); 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<article class="article"> 
 
    <h1>Ripple</h1> 
 
    <p id="coin_value">test</p> 
 
    <p></p> 
 
    <p><strong></strong></p> 
 
</article>

您需要遍歷結果對象在success處理程序，並在需要的格式追加數據。

另請注意，如果您打電話給https://api.coinmarketcap.com/v1/ticker/ripple - 您似乎打算，但代碼沒有執行 - 那麼您將被CORS阻止。

Answer 2

先生，請試試這個，我認爲它有助於您

var AltCoin = "ripple"; 
 
var api_url = "https://api.coinmarketcap.com/v1/ticker/"; 
 

 
$.ajax({ 
 
    method: "GET", 
 
    dataType: "JSON", 
 
    data: AltCoin, 
 
    url: api_url, 
 
    success: function(data) { 
 
    var content=""; 
 
    
 
    $.each(data[0], function(key, value) { 
 
    content+="Key :<b>"+key +"</b> Value :<b>"+value+"</b><br/>"; 
 
}); 
 

 
    $('#coin_value').html(content); 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<article class="article"> 
 
    <h1>Ripple</h1> 
 
    <p id="coin_value">test</p> 
 
    <p></p> 
 
    <p><strong></strong></p> 
 
</article>