0

我在这里需要你的帮助。每次我尝试显示一个内容时，它都会显示几次（通常是 4 次），但应该只显示一次。我不知道我的代码有什么问题。如下：

$.ajax({
    url: 'https://' + subParam + '.domain.name/' + akey + '/get_article',
    async: false,
    callback: 'callback',
    crossDomain: true,
    contentType: 'application/json; charset=utf-8',
    type: 'POST',
    dataType: 'jsonp',
    success: function (data, status) {
        if (data !== undefined && data.post !== undefined) {
            if (data !== undefined && data.post.author.description > 0) {
                if (data.post.thumbnail_images.large.url !== undefined) {
                    $.each(data.post.thumbnail_images, function (i2, type) {
                        $('#news').append('<div id="nimg" style="background-image: url(' + data.post.thumbnail_images.large.url + ')"></div><a href="author.html?type=authors&id=' + data.post.author.description + '"><div id="circletag" style="background-image: url(' + data.post.author.nickname + ')"></div></a><div id="newstext"><div id="newstitle">' + data.post.title + '</div><div>' + data.post.content + '</div><div><a href="#" onclick="window.open(\'' + data.post.custom_fields.syndication_permalink + '#comments\', \'_system\', \'location=yes\');" id="verstovcomments"></a></div></div>');
                    });
                } else {
                    $('#news').append('<div id="nimg" style="background-image: url(' + defaultNews + ')"></div><a href="author.html?type=authors&id=' + data.post.author.description + '"><div id="circletag" style="background-image: url(' + data.post.author.nickname + ')"></div></a><div id="newstext"><div id="newstitle">' + data.post.title + '</div><div>' + data.post.content + '</div><div><a href="#" onclick="window.open(\'' + data.post.custom_fields.syndication_permalink + '#comments\', \'_system\', \'location=yes\');" id="verstovcomments"></a></div></div>');
                }
            }
        }
    }
});

……

我的 json 响应看起来像：

{
    "status": "ok",
    "post": {
        "id": 3211,
        "title": "title",
        "content": "content"
        "thumbnail": "/uploads\/2013\/09\/matkapital-150x150.jpg",
        "thumbnail_size": "thumbnail",
        "thumbnail_images": {
           "full": {
                "url": "/uploads\/2013\/09\/matkapital.jpg",
                "width": 640,
                "height": 427
            },
            "thumbnail": {
                "url": "/uploads\/2013\/09\/matkapital-150x150.jpg",
                "width": 150,
                "height": 150
            },
            "medium": {
                "url": "/uploads\/2013\/09\/matkapital-250x166.jpg",
                "width": 250,
                "height": 166
            },
            "large": {
                "url": "/uploads\/2013\/09\/matkapital-640x426.jpg",
                "width": 640,
                "height": 426
            }
        }
    }
}

是因为我正在使用$.each还是有其他问题？

4

3 回答 3

0

从我可以看到authorjson中没有属性，所以条件if (data !== undefined && data.post.author.description > 0) {会抛出一个错误，说data.post.author是未定义的。

所以将条件更改if (data !== undefined && data.post.author.description > 0) {为if (data.post.author && data.post.author.description) {并尝试

在这种情况下，您的数据将不会显示任何内容，因为给定的 json 中没有作者数据

于 2013-09-20T09:52:20.623 回答
0

我建议你看看像 doT.js 这样的 JS 模板引擎。

然后你可以轻松地创建一个干净的标记结构，只需将你的 json 数据转储到模板引擎......整个迭代和输出都是自己完成的，你的 JS 代码没有这些几乎不可读的标记连接。

这是一个小例子：

// normally you would have the templace in
// a <script type="text/dotjs-or-so"> block and load it with jquery.

var jsonData = {"array":["banana","apple","orange"]};
var tplstring = 
'{{~it.array :value:index}}'
    +'<div>{{=value}}!</div>'
+'{{~}}';
var tpl = doT.template(tplString);
// render it somewhere
$('#someThing').html(
   tpl(jsonData)
);

见http://olado.github.io/doT/

于 2013-09-20T09:53:09.503 回答
0

我刚刚在 $.each(data.post.thumbnail_images, function (i2, type) 中将 thumbnail_images 更改为 custom_fields，它停止了乘法结果。

 $.ajax({
url: 'https://' + subParam + '.domain.name/' + akey + '/get_article',
async: false,
callback: 'callback',
crossDomain: true,
contentType: 'application/json; charset=utf-8',
type: 'POST',
dataType: 'jsonp',
success: function (data, status) {
    if (data !== undefined && data.post !== undefined) {
        if (data !== undefined && data.post.author.description > 0) {
            if (data.post.thumbnail_images.large.url !== undefined) {
                $.each(data.post.custom_fields, function (i2, type) {
                    $('#news').append('<div id="nimg" style="background-image: url(' + data.post.thumbnail_images.large.url + ')"></div><a href="author.html?type=authors&id=' + data.post.author.description + '"><div id="circletag" style="background-image: url(' + data.post.author.nickname + ')"></div></a><div id="newstext"><div id="newstitle">' + data.post.title + '</div><div>' + data.post.content + '</div><div><a href="#" onclick="window.open(\'' + data.post.custom_fields.syndication_permalink + '#comments\', \'_system\', \'location=yes\');" id="verstovcomments"></a></div></div>');
                });
            } else {
                $('#news').append('<div id="nimg" style="background-image: url(' + defaultNews + ')"></div><a href="author.html?type=authors&id=' + data.post.author.description + '"><div id="circletag" style="background-image: url(' + data.post.author.nickname + ')"></div></a><div id="newstext"><div id="newstitle">' + data.post.title + '</div><div>' + data.post.content + '</div><div><a href="#" onclick="window.open(\'' + data.post.custom_fields.syndication_permalink + '#comments\', \'_system\', \'location=yes\');" id="verstovcomments"></a></div></div>');
            }
        }
    }
}

});

于 2013-09-20T10:11:35.797 回答