使用getexchangerates.com API显示不同货币的价格表

时间:2015-04-28 13:11:38

标签: api jscript rate

这是我在这里发表的第一篇文章,所以请保持温柔! : - )

我在网页上有一张以GB Pounds为单位的价格表,我想添加一些价格为几种主要货币(例如美元,欧元等)的列。

我找到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>

感谢。

理查德

1 个答案:

答案 0 :(得分:0)

尝试:

</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>

返回的数据是一个对象而不是一个数组。因此,您无法遍历传回的数据。