我对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
答案 0 :(得分:2)
不确定我是否理解正确,但如果您要删除已加载的图片,则可以执行以下操作:
$('img').remove();
代替$('img').attr('src', '');
答案 1 :(得分:1)
将 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