цикл 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 ... причина, по которой я хочу избежать append, заключается в том, что я хочу обновить div usng setInterval ().

Как показать все изображения, которыеЯ получаю ответ json, используя .html ()?

спасибо:)

Answer 1

Когда вы звоните 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, вам просто нужно очистить содержимое раньше.

Answer 2

Используйте 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>