2015-04-28 3 views
0

это мое первое сообщение, поэтому, пожалуйста, будьте нежны! :-)Использование API getexchangerates.com для отображения таблицы цен в разных валютах

У меня есть таблица цен на веб-страницу, которая в фунтах стерлингов, и я хотел бы добавить несколько столбцов с ценами в нескольких основных валютах (например, USD, EUR и т.д.)

Я нашел http://www.getexchangerates.com/api/ и могу назвать API, но не могу заставить его работать с веб-страницы. Я понимаю, что это предотвращает проблемы с сайтом. Есть ли способ сделать это, пожалуйста?

Если я могу получить вызов API для работы, я должен уметь сортировать вычисления и таблицу.

Код, который я пытаюсь, находится ниже - он возвращает пустую панель заголовка «Валюта».

<body> 
<h1>Currencies</h1> 
<div id="id01"></div> 
<script> 
var xmlhttp = new XMLHttpRequest(); 
var url = "http://www.getexchangerates.com/api/latest.json?currencies=EUR,GBP"; 
xmlhttp.onreadystatechange=function() { 
    if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { 
    myFunction(xmlhttp.responseText); 
    } 
} 
xmlhttp.open("GET", url, true); 
xmlhttp.send(); 

function myFunction(response) { 
    var arr = JSON.parse(response); 
    var i; 
var out = "<table>"; 

for(i = 0; i < arr.length; i++) { 
    out += "<tr><td>" + 
    arr[i].USD + 
    "</td><td>" + 
    arr[i].EUR + 
    "</td><td>" + 
    arr[i].GBP + 
    "</td></tr>"; 
} 
out += "</table>" 
document.getElementById("id01").innerHTML = out; 
} 
</script> 

</body> 
</html> 

Thanks.

Ричард

ответ

0

Try:

</html> 
<head> 
</head> 
<body> 
<h1>Currencies</h1> 
<div id="id01"></div> 
<script> 

(function() { 
    var xmlhttp = new XMLHttpRequest(); 
    var url = "http://www.getexchangerates.com/api/latest.json?currencies=EUR,GBP"; 
    xmlhttp.onreadystatechange=function() { 
     if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { 
     myFunction(xmlhttp.responseText); 
     } 
    } 
    xmlhttp.open("GET", url, true); 
    xmlhttp.send(); 

    function myFunction(response) { 
     var arr = JSON.parse(response); 
     var out = "<table border='1'><tr><td>USD</td><td>EUR</td><td>GBP</td></tr><tr><td>" + arr.USD + "</td><td>" + arr.EUR +"</td><td>" + arr.GBP + "</td></tr>" + "</table>"; 
     document.getElementById("id01").innerHTML = out; 
    } 
})(); 

</script> 

</body> 
</html> 

Данные, возвращаемые является объектом, а не массив. Следовательно, вы не могли перебирать данные, переданные обратно.

+0

Фантастический! Праваль, большое спасибо! – Richard