JQuery的jQuery - 获取图像

即时通讯设法将img + p元素封装在一个div中，但由于某种原因，所有在每个div创建的元素 ...我做错了什么？JQuery的jQuery - 获取图像

<script type="text/javascript"> 
    var url = "http://api.flickr.com/services/rest/?method=flickr.photos.search&api_key=**myAPI**&tags=**myTAG**&per_page=20 "; 
    var src; 
    $.getJSON(url + "&format=json&jsoncallback=?", function (data) { 
     $.each(data.photos.photo, function (i, item) { 
      src = "http://farm" + item.farm + ".static.flickr.com/" + item.server + "/" + item.id + "_" + item.secret + "_m.jpg"; 
      $("<div class='test'></div>").appendTo(".wrap"); 
      $("<img/>").attr("src", src).attr("class", "titleBox").appendTo(".test"); 
      $('<p>', { class: 'titleBox', text: item.title }).appendTo(".test"); 
     }); 
    });

我希望它看起来像这样：

<div class="wrap"> 
<div class="test"> 
<img src="#"/> 
<p>some text</p> 
</div> 
<div class="test"> 
    <img src="#"/> 
    <p>some text</p> 
</div> 
<div class="test"> 
<img src="#"/> 
<p>some text</p> 
</div> 
</div>

来源

2013-10-15 user2828251

你可以发布由api返回的json吗？ – Praveen

添加一个id的div是这样的：

$.each(data.photos.photo, function (i, item) { 
     src = "http://farm" + item.farm + ".static.flickr.com/" + item.server + "/" + item.id + "_" + item.secret + "_m.jpg"; 
     $("<div class='test' id='test" + i.toString() + "'></div>").appendTo(".wrap"); 
     $("<img/>").attr("src", src).attr("class", "titleBox").appendTo("#test" + i.toString()); 
     $('<p>', { class: 'titleBox', text: item.title }).appendTo("#test" + i.toString()); 
    });

来源

2013-10-15 13:04:24

当你追加到.test，你不指定去哪个.test，因此它会自动取第一个元素。您的.each索引，使用它：

$("<img/>").attr("src", src).attr("class", "titleBox").appendTo(".test:eq(" + i + ")"); 
$('<p>', { class: 'titleBox', text: item.title }).appendTo(".test:eq(" + i + ")");

来源

2013-10-15 13:03:26 tymeJV

你所有的div具有相同的类“测试”和你正在使用这个类作为选择器在appendTo（“。test”），因此，自选择器条件满足以来，所有元素都会附加到第一个div。

解决方案：在appendTo（“＃id”）中使用“id”作为选择器，它唯一标识div。（你可以使用循环中的计数作为id）

来源

2013-10-15 13:12:23 code2use

JQuery的jQuery - 获取图像

回答

相关问题