Как добавить в ближайший div (по классу)? - PullRequest
4 голосов
/ 05 ноября 2010

Я пытаюсь сделать какой-нибудь jQuery, который найдет изображения внутри текста, обернет изображение внутри div и затем переместит его в другой div, но я не могу заставить его работать.

Вот код, который у меня есть, который работает:

$(".newsIntro").find("img").wrap("<div class=\"newsImage\" />");

Но, когда я пытаюсь переместить его, либо все изображения на странице перемещаются внутри одного div (вместо перехода к родительскому div (".newsItem"), либо ничего не происходит.

$(".newsImage").appendTo( $(this).closest(".newsItem") );

Вышесказанное ничего не делает:

$(".newsImage").appendTo(".newsItem");

Тот, что выше, перемещает их всех в первый .newsItem div.

Вот фрагмент HTML:

<div class="newsItem">
  <div class="newsHeader">
    <h2><a href="/news-information/67-latest-news-03.html">Latest News 03</a></h2>
  </div>
  <div class="newsIntro"><img src="/images/stories/opals-are-lucky/img_abopal_lucky.jpg" border="0" align="left" />Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Fusce dictum sagittis sapien. Aliquam erat volutpat. Nulla facilisi. Ut purus neque, condimentum nec,
    auctor eget, semper ut, enim. Vestibulum sem tellus, vestibulum a, vehicula ut, feugiat id, libero. Pellentesque enim justo, condimentum sed, dictum at, viverra eget, odio. Aliquam feugiat metus id lacus. Cum sociis natoque penatibus et magnis dis
    parturient montes, nascetur ridiculus mus. Nam iaculis iaculis quam. Donec eu dui.</div>
  <div class="clear"></div>
</div>

<div class="newsItem">
  <div class="newsHeader">
    <h2><a href="/news-information/68-latest-news-03.html">Latest News 03</a></h2>
  </div>
  <div class="newsIntro"><img src="/images/stories/about-us/img_showroom.jpg" border="0" align="right" />Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Fusce dictum sagittis sapien. Aliquam erat volutpat. Nulla facilisi. Ut purus neque, condimentum nec, auctor eget,
    semper ut, enim. Vestibulum sem tellus, vestibulum a, vehicula ut, feugiat id, libero. Pellentesque enim justo, condimentum sed, dictum at, viverra eget, odio. Aliquam feugiat metus id lacus. Cum sociis natoque penatibus et magnis dis parturient montes,
    nascetur ridiculus mus. Nam iaculis iaculis quam. Donec eu dui.</div>
  <div class="clear"></div>
</div>

1 Ответ

9 голосов
/ 05 ноября 2010

Вам необходимо выполнить цикл с помощью .each(), поэтому this относится к каждому элементу по мере поступления, например:

$(".newsImage").each(function() {
  $(this).closest(".newsItem").append(this);
});

Так как .appendTo() в любом случае переворачивается на .append(), этот путь более эффективен.

...