Question

我有一个练习，我必须使用getJSON方法在html页面上显示来自 http://headers.jsontest.com/的信息！

以下是我的js代码。。我不知道如何解决这个问题。。

    $(document).ready(function() {
$('#id-a a').click(function() {
var url = "http://headers.jsontest.com/";
$.getJSON(url, function(data) {
$('#content').empty();
$.each(data, function(entryIndex, entry) {
var html = '<div class="entry">';
html += '<div class="language">' + entry['Accept-Language'] + '</div>';
html += '<div class="host">' + entry['Host'] + '</div>';
html += '<div class="usr">'+ entry['User-Agent'] + '</div>';
html += '<div class="accept">'+ entry['Accept'] + '</div>';
html += '</div>';
html += '</div>';

$('#content').append(html);
});
});
return false;
});

})

帮帮我吧！谢谢！

Answer 1

使用data['Accept-Language']代替entry['Accept-Language']。并删除$.each，因为这将遍历键，而不是通过对象。

<强> HTML

<div id="id-a" style="width: 200px; height: 100px; border: 1px solid #000">
    <a href="#">click me</a>
</div>

<div id="content" style="width: 200px; height: 100px; border: 1px solid #000; margin-top: 30px;"></div>

<强> SCRIPT

<script>
    $(document).ready(function() {
        $('#id-a a').click(function(e) {
            e.preventDefault();
            var url = "http://headers.jsontest.com/";
            $.getJSON(url, function(data) {
                $('#content').empty();
                var html = '<div class="entry">';
                html += '<div class="language">' + data['Accept-Language'] + '</div>';
                html += '<div class="host">' + data['Host'] + '</div>';
                html += '<div class="usr">' + data['User-Agent'] + '</div>';
                html += '<div class="accept">' + data['Accept'] + '</div>';
                html += '</div>';
                //html += '</div>'; //Do not need this, there are no opening tag for this div.
                $('#content').append(html);
            });
            //Do not need this. Use e.preventDefault(); instead.
            //return false;
        });
    })

</script>

我该如何修复这个getJSON方法（）？

1 个答案: