使用不同json变量的for循环显示所有项目,而不是每个项目

时间:2018-12-28 11:34:31

标签: javascript json

所以根据我之前回答的问题(https://help.gradle.org

我使用发送到js变量的php中的数据创建了第二个json变量,因此我已经有一个显示显示在最后,在此位置,用户阅读以下帖子:

 [ //defined by var = book | remove url for privacy reason.
    {
        "id": 39,
        "title": "My Pet",
        "url": "https:///novel/my-pet/",
        "chapter": {
            "id": 1192,
            "title": "35",
            "url": "https:///my-pet-35/"
        }
    },
    {
        "id": 37,
        "title": "Nobunaga’s Imouto",
        "url": "https:///novel/nobunagas-imouto/",
        "chapter": {
            "id": 1449,
            "title": "2",
            "url": "https:///nobunaga-imouto-2/"
        }
    },
    {
        "id": 2,
        "title": "Duke's Daughter",
        "url": "https:///novel/dukes-daughter/",
        "chapter": {
            "id": 1398,
            "title": "99",
            "url": "https:///dukes-daughter-99/"
        }
    }
]

第一个json从cookie获取数据,因此用户可以跟踪其最后一次读取。 至于第二个json变量,则显示类别中最新的帖子

[ //defined by var = newest
    {
        "id": 39,
        "title": "My Pet Chapter 35",
        "url": "https:///my-pet-35/",
    },
    {
        "id": 37,
        "title": "Nobunaga’s Imouto Chaoter 4",
        "url": "https:///nobunaga-imouto-4/",
    },
    {
        "id": 2,
        "title": "Duke's Daughter Chapter 106",
        "url": "https:///dukes-daughter-106/",
    }
]

然后用for循环显示它们:

    $bookcontainer = $('#release_history'); 
    for (var i in books) {
        var book = books[i];
        var html = '<div class="row"><div class="book_history">';
        html += '<a href="'+book.url+'">'+book.title+'</a></div>';

         // Display last user read from json

        html += '<div class="newest_history">';
        for (var j in newest) { // display the newest of a post from category
            var news = newest[j];
            html += '<a href="'+news.url+'">»Chapter '+news.title+'</a></div>';
        }
        html += '</div></div></div>';
        $bookcontainer.append(html);
    }

但是它将显示如下: Click Here

因此,我认为如果两个ID相等,则有条件添加。

            for (var j in newest) {
            var news = newest[j];
            if (news.id == book.id){
                html += '<a href="'+news.url+'">»Chapter '+news.title+'</a></div>';}
            }

但是,在显示第一个输出之后,循环将停止。 有什么解决办法吗?在显示时将它们分开?我想显示类别的最新章节/帖子,以便用户可以知道最近阅读的书中有新章节。

3 个答案:

答案 0 :(得分:0)

您正在检查这两个对象的index ID是否相同,例如id的{​​{1}}和index:0的{​​{1}}是否相同它不会显示它,因为您没有检查它是否包含:

尝试一下:

id

答案 1 :(得分:0)

那么您只想知道当前用户未读过哪些书?

const books = [ //defined by var = book
    {
        "id": 39, //Category ID
        "title": "Last Read A",
        "url": "Chapter URL A",
    },
    {
        "id": 37, //Category ID
        "title": "Last Read B",
        "url": " Chapter URL C",
    },
    {
        "id": 2, //Category ID
        "title": "Last Read C",
        "url": " Chapter URL C",
    }
];

const newest = [ //defined by var = newest
    {
        "id": 39, //Category ID
        "title": "Newest Chapter A",
        "url": "Post URL Chapter A",
    },
    {
        "id": 37, //Category ID
        "title": "Newest Chapter B",
        "url": " Post URL Chapter C",
    },
    {
        "id": 2, //Category ID
        "title": "Last Read C",
        "url": " Chapter URL C",
    },

    //Added a different book with id 10
    {
        "id": 10, //Category ID
        "title": "Newest Chapter C",
        "url": " Post URL Chapter C",
    }
];

newBooks = newest.filter(function (element) {
    return books.filter(function (book) {
        if (element.id !== book.id) {
            return false;
        }

        if (element.title !== book.title) {
            return false;
        }

        return element.url === book.url;
    }).length === 0;
});

console.log(newBooks);

过滤器功能允许您过滤条件为真的条目。

在此示例中,我检查了过滤后的书本数组的大小是否等于零。

为零时,用户未阅读新章节。

因此,过滤后的书本数组给我的条目不等于“最新”数组的当前条目。

示例输出:

[ { id: 39, title: 'Newest Chapter A', url: 'Post URL Chapter A' },
{ id: 37, title: 'Newest Chapter B', url: ' Post URL Chapter C' },
{ id: 10, title: 'Newest Chapter C', url: ' Post URL Chapter C' } ]

您会看到ID为“ 2”的条目已被过滤,因为它们具有相同的数据。

答案 2 :(得分:0)

已通过更改解决:

for (var j in newest)

for (var j = 0; j < newest.length; j++)

在第二个循环中仅使用var j in这样的感觉很错