Javascript JSON数据未定义,但显示在控制台日志中
我正在访问以下JSON数据: 当我试图访问位于下面代码第4行的数组中的“url”属性时,我得到一个未定义的错误。即使它将与console.log(val.attachments[0].url)一起出现在console.log(第13行)中 代码如下:Javascript JSON数据未定义,但显示在控制台日志中,javascript,jquery,json,each,Javascript,Jquery,Json,Each,我正在访问以下JSON数据: 当我试图访问位于下面代码第4行的数组中的“url”属性时,我得到一个未定义的错误。即使它将与console.log(val.attachments[0].url)一起出现在console.log(第13行)中 代码如下: $.each(data.posts, function(index, val){ output += '<li>'; output += '<a href="#blogpost"
$.each(data.posts, function(index, val){
output += '<li>';
output += '<a href="#blogpost" onclick = showPost(' + val.id + ')">';
output += '<img src="' + val.attachments[0].url + '" alt="">';
output += '<h3>' + val.title + '</h3>';
//Here we shorten the paragraph to 60 characters.
var str = val.excerpt;
var paraInfo = str.slice(0, 60);
output += '<p>' + paraInfo + '</p>';
//Closing off the the closing html tags
output += '</a>';
output += '</li>';
console.log(val.attachments[0].url);
});//Go through each post
$.each(data.posts、function(index、val){
输出+='';
输出+='';
输出+=' ';
console.log(val.attachments[0].url);
});//浏览每一个帖子
非常感谢您的建议我想还有别的问题 我手动下载了json,并编写了以下代码: HTML: 无论如何;看不出你的代码有什么问题吗?你确定这就是问题所在吗 PS:我甚至在
$中添加了以下内容。每个循环:
if (!p.attachments[0].url) {
alert(p.id + ' has undefined url!');
}
没有看到任何警报
JSON似乎无效。您真的确定它与您在控制台中看到的值相同,而不是上一次迭代中看到的值吗?如果您遇到错误,它将停止脚本执行,不再到达console.log行。它在控制台中正常工作,并列出所有url数据。正如它应该使用的那样,哪一行准确地显示了错误,它具体说了什么?TypeError:val.attachments[0]未定义感谢您的反馈。我将沿着这些思路进行测试。你对地球的反应比其他的反应都要多。谢谢您可能还希望检查p.attachments在数组中是否有任何值,以及附件是否有urlif(p.attachments&&p.attachments.length>0&&p.attachments[0].url){…}
@lowfi2dev;只是修改了文件;请注意,您的一些文章没有带有URL的附件。
function extractUrls(data) {
var $foo = $('#foo');
$.each(data.posts, function (i, p) {
$foo.append($('<li></li>').text(p.attachments[0].url));
});
}
var jsonData = { /* code omitted for brevity */ };
extractUrls(jsonData);
Urls:
<ul id="foo">
<li>http://veratech.co.nz/blog/wp-content/uploads/2014/03/martial.jpg</li>
<li>http://veratech.co.nz/blog/wp-content/uploads/2013/12/grave.jpg</li>
<li>http://veratech.co.nz/blog/wp-content/uploads/2013/12/GTA5.jpg</li>
<li>http://veratech.co.nz/blog/wp-content/uploads/2013/10/miyagi.jpg</li>
<li>http://veratech.co.nz/blog/wp-content/uploads/2013/08/htc-box.png</li>
<li>http://veratech.co.nz/blog/wp-content/uploads/2013/08/scaffold1.jpg</li>
<li>http://veratech.co.nz/blog/wp-content/uploads/2013/07/barriera.png</li>
<li>http://veratech.co.nz/blog/wp-content/uploads/2013/06/tv.jpg</li>
</ul>
$.get('http://veratech.co.nz/blog/', { json: 1 }, extractUrls, 'json');
if (!p.attachments[0].url) {
alert(p.id + ' has undefined url!');
}