Question

我对jsonp有一个要求，我做了所有这些更改，这里有一个问题。一旦我在文本框中输入标签名称，图像将显示应该没问题。问题是，一旦我添加另一个标签，之前加载的图像不会被清除（将被隐藏），图像显示在同一行。标签名称是：冬天，动物，鸟，巴黎。这是我的代码

    $('#idSubmit').click(function(){    
   var txtVal = $('#idText').val(); 
    $.ajax({
            type:'GET',
            url:"http://api.flickr.com/services/feeds/photos_public.gne?tags="+txtVal,
            data:"&lang=en-us&format=json&jsoncallback=?",
            success:function(data) {
            //var thing = $('body :contains("Web")').text();
                $.each(data.items, function(i, item) {
                    //$("<div/>").appendTo(body)
                     alert(item);                   
                    var tagImgs = $("<img/>").attr("src", item.media.m).appendTo("#images");
                    var tagNames = item.tags;
                    var tagNames = tagNames.split(' ');                 
                    if (tagImgs){
                        $("<div/>").html(tagImgs).appendTo("body").attr('title',tagNames[0]);
$("<div/>").html(tagImgs).appendTo("body").attr('title',tagNames[0]);                       
                        if (i == 9) return false;
                    }                   
                });
            },
            dataType:'jsonp'
       });
  });

这是小提琴fiddle

Answer 1

不确定我是否理解正确，但如果您要删除已加载的图片，则可以执行以下操作： $('img').remove();代替$('img').attr('src', '');

Answer 2

将 class 添加到要追加的元素

$("<div/>").html(tagImgs).appendTo("body")
        .attr('title',tagNames[0])
        .addClass('added');

使用此引用，您可以删除现有元素，然后再附加

 $('.added').remove();
 $("<div/>").html(tagImgs).appendTo("body")
            .attr('title',tagNames[0])
            .addClass('added');

选中此fiddle

如何清除以前加载的图像并添加新图像

2 个答案: