jquery的循环的getJSON

Question

jQuery代码

<script type="text/javascript"> 
$(document).ready(function() 
{ 
$.getJSON("http://localhost/index.php/upload/history",function(data) 
{ 
$.each(data.images, function(i,data) 
{ 
$('#recent').html('<img src="/t/' +data.imagename + '">'); 
}); 
} 
); 
return false; 
}); 
</script> 

样品JSON数据

{ 
    "images": [ 
     { 
      "imagename": "p5Tsa.jpg" 
     }, 
     { 
      "imagename": "Z8hjA.jpg" 
     }, 
     { 
      "imagename": "0Fnm0.jpg" 
     }, 
     { 
      "imagename": "D5Tfa.jpg" 
     }, 
     { 
      "imagename": "VDnvu.jpg" 
     }, 
     { 
      "imagename": "9spgp.jpg" 
     }, 
     { 
      "imagename": "Hg7va.jpg" 
     } 
    ] 
} 

此仅示出了第一图像..但是当我使用的append（），则显示所有的图像多数民众赞成在json响应..我想避免追加的原因是，我想刷新div usng setInterval（）。

如何使用.html（）显示我在json响应中获得的所有图像？

谢谢:)

Answer 1

使用append，但清除每个提取的html。

<script type="text/javascript"> 
$(document).ready(function() 
{ 
$.getJSON("http://localhost/index.php/upload/history",function(data) 
{ 
$('#recent').html(""); 
$.each(data.images, function(i,data) 
{ 
$('#recent').append('<img src="/t/' +data.imagename + '">'); 
}); 
} 
); 
return false; 
}); 
</script> 

Answer 2

当你调用html()要设置元素的全部内容。有几种方法可以解决这个问题。我会做

$.getJSON("http://localhost/index.php/upload/history",function(data) { 
    var images = $.map(data.images, function(data) { 
     return '<img src="/t/' +data.imagename + '">'; 
    }).get(); 
    $('#recent').html(images.join('')); 
}); 

只插入到文档一次。

你可以很容易地做到这一点与append，你只需要清除之前的内容。