0

im trying to wrap the img + p elements in one div, but for some reason all the elements created in each div... what am i doing wrong ?

  <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");
         });
     });

i want it to look like this :

<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>
4

3 回答 3

0

您所有的 div 都具有相同的类“test”,并且您将此类用作 appendTo(".test") 中的选择器,因此,由于满足选择器条件,所有元素都将附加到第一个 div。

解决方案:在 appendTo("#id") 中使用“id”作为选择器来唯一标识 div。(您可以使用循环中的计数作为id)

于 2013-10-15T13:12:23.867 回答
0

当您附加到 时.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-15T13:03:26.830 回答
0

向 div 添加一个 id,例如:

$.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-15T13:04:24.723 回答