无法让getJSON显示数组中的值

I am having trouble displaying the contents of a $.getJSON call. I have this code which retrieves some JSON data from a page.

我在显示$ .getJSON调用的内容时遇到问题。我有这个代码从页面中检索一些JSON数据。

var loadItems = function() {
if (hasNextPage === false) {
    return false
}
pageNum = pageNum + 1;
var url = baseUrl + "json/" + pageNum + '/';
var jqxhr = $.getJSON(url, function (data) {
    var a = [];
    $.each(data.itemList, function (item) {
            a.push("<li>" + item.title + "</li>");

    });
    $("<ul/>", {html: a.join(" ")}).appendTo("#anchor");

});
jqxhr.complete(function () { alert('done!'); $(window).bind('scroll', loadOnScroll); });
};

The idea is just to load a page dynamically based on scroll position, and get the JSON contents of that page (for an infinite scroll effect). The JSON structure is something like this:

这个想法只是根据滚动位置动态加载页面,并获取该页面的JSON内容(用于无限滚动效果)。 JSON结构是这样的:

{ "key1": val1, "key2": val2, "itemList": [ {"title": "title", "author": "author", "id": 100, "slug": slug, }, ... ] }

The important values are in itemList, where I have to retrieve data that will get plugged into my django template, which in turn will get some data from the view. Everything seems to work just fine, except that I can't access the data in itemList. Nothing seems to get pushed into the array. because nothing gets displayed on the page (namely, the <li> that should be created). This seems to be a simple implementation of a basic ajax move, but its not working.

重要的值在itemList中,我必须检索将插入到我的django模板中的数据,然后该模板将从视图中获取一些数据。除了我无法访问itemList中的数据外,一切似乎都运行得很好。似乎没有任何东西被推入阵列。因为页面上没有显示任何内容(即应该创建的

)。这似乎是一个基本的ajax移动的简单实现,但它不起作用。

EDIT:

I've done some bug tracking and have found that the code never executes the $.each loop. Not sure how to resolve this though.

我做了一些bug跟踪,发现代码永远不会执行$ .each循环。不知道如何解决这个问题。

3 个解决方案

#1

you should be using error log to check what is going wrong:and always use index,obj format in $.each to be safe.

你应该使用错误日志来检查出错的地方:并且始终在$ .each中使用index,obj格式是安全的。

 $.getJSON(url).success( function( data ) {
                    console.log(data);
    $.each(data.itemList, function (index, item) {
    a.push("<li>" + item.title + "</li>");
   });
    $("<ul/>", {html: a.join(" ")}).appendTo("#anchor");

                }).error(function(error){
                    console.log(error);// see if you are getting in error log..
                });

and your json data is also wrong it should be something like this:

你的json数据也错了它应该是这样的:

{ "key1": "val1",
 "key2": "val2",
 "itemList": 
[
 {
"title": "title", "author": "author", "id": 100, "slug": "slug" 
},....... 
]

 }

try with corrected data it will work. you can check your data here:http://json.parser.online.fr/

尝试使用更正的数据,它将起作用。你可以在这里查看你的数据:http://json.parser.online.fr/

#2

I saw the problems in your code when you using

您在使用时看到了代码中的问题

 $.each() //It should using for dictionary.

So I have two solutions for you

所以我有两个解决方案给你

1) You can use forEach method.

1)您可以使用forEach方法。

ex:

`if(data != null && data.itemList.length > 0)
{
    data.itemList.forEach(function (item) {
                       a.push("<li>" + item.title + "</li>");
                       });
}`

==> This way will work for IE 10+, and the other browers.

==>这种方式适用于IE 10+和其他浏览器。

2) Using the $.each method

2)使用$ .each方法

ex:

if(data != null && data.itemList.length > 0)
{
   $.each(data.itemList, function (key, item) {
            a.push("<li>" + item.title + "</li>");
    });
}

==> Your Json data is dictionary type, so if you use $.each you need to define two variable with

==>您的Json数据是字典类型,因此如果您使用$ .each,则需要定义两个变量

key: is the key of data.
item: is the value of data.

Note: this way will be worked for all browers version.

注意:这种方式适用于所有浏览器版本。

Hope this can helps you.

希望这可以帮助你。

#3

It's because your 'item' is an index, not an 'object' as you want. you have to use the second parameter:

这是因为你的'item'是一个索引,而不是你想要的'对象'。你必须使用第二个参数:

$.each(data.itemList, function (index, item) {
        a.push("<li>" + item.title + "</li>");
});

also, where is hasNextPage defined? is it defined? you might also shorten that to:

还有,hasNextPage定义在哪里?是定义了吗?你也可以缩短到:

if (!hasNextPage) return;

#1