Отсутствует миниатюра Simplepie rss, альтернативное решение с использованием jQuery

У меня были проблемы с извлечением эскизов из простого rss. Я просмотрел все, в том числе здесь, на SO, но, похоже, не нашел хорошего решения, которое работает. Тем более, что мне нужны эскизы для ВСЕХ каналов и их тем.

Это говорит о том, что я решил сделать это с помощью jquery, чтобы выполнить поиск в div rss-контента для источника img, сохранить эту исходную строку в переменной и использовать это значение для заполнения другого div, который я настроил специально для эскизы. Почти у всех постов есть изображения, так что все должно быть в порядке.

У меня это работает, но есть часть, которую я не могу охватить своим мозгом. RSS загружается на страницу с помощью php через цикл for. Ради тестирования приложения я загружаю 2 канала одновременно с этим

$feed->set_item_limit(2);

Это означает, что приведенный ниже код (php) выполняется дважды, что дает мне два канала.

[PHP + HTML]

<div id="mainContW">
<h1>Feed Content below</h1>
<br><br>

  <?php 
    //loop through all the content
    foreach($feed->get_items() as $feedItems){
  ?>
  <div class="feedContBox">
    <h2><a href="<?php echo $feedItems->get_permalink(); ?>" target="new"><?php echo $feedItems->get_title(); ?></a></h2>
    <br>
    <div class="feedThm"><img src="images/default-thm.jpg" alt=""></div>

    <br>

    <?php //echo $feedItems->get_description(); ?>
    <div class="feedContActual"><?php echo $feedItems->get_content(); ?></div>
    <br>
    <?php echo $feedItems->get_date(); ?>
    <br><br>
  </div><!-- feedContBox ender -->
  <?php
      }
    } //this ends the if/else above towards the top
  ?>

</div><!-- mainContentW ender -->

Я хочу взять источник изображений из этого html/php выше, сохранить их в переменной, чтобы затем добавить его в другой div для создания собственных миниатюр.

У меня это работает с этим: [jQuery]

function replaceThm(){

    //this is a div to hold my own thumbnails
    var feedThm = $('.feedThm img');


    //this finds the img tag src on the content div from the feed
    var imgThm = $('.feedContActual').find("img").attr("src");

    feedThm.attr('src', imgThm);
}

replaceThm();

Проблема, с которой я сталкиваюсь, заключается в том, что, хотя это и работает, проблема заключается в том, что, поскольку приведенный выше код HTML/PHP находится в цикле, он берет только что созданный большой палец, созданный с помощью jQ, и помещает его на ВСЕ посты с использованием изображения из первого поста. Он берет изображение из первого сообщения и добавляет его в качестве большого пальца во ВСЕ сообщения.

Так, например, скажем, что у нас есть начальные два поста.

POST 1
   POST 1 IMAGE


POST 2
   POST 2 iMAGE

Что он делает:

NEW THUMB FROM THIS DIV IMG SOURCE equals TO POST 1 IMAGE (GOOD)
POST 1
   POST 1 IMAGE

NEW THUMB FROM THIS DIV IMG SOURCE equals TO POST 1 IMAGE (**NOT GOOD**)
POST 2
   POST 2 iMAGE

Что я хочу сделать, так это:

NEW THUMB FROM THIS DIV IMG SOURCE equals TO POST 1 IMAGE (GOOD)
POST 1
   POST 1 IMAGE

NEW THUMB FROM THIS DIV IMG SOURCE equals TO POST 2 IMAGE (GOOD)
POST 2
   POST 2 iMAGE

Я понимаю, ПОЧЕМУ это делается, и я не могу понять, как сделать цикл кода jQuery, как это делает php. Я попытался вставить блок «скрипт» в div большого пальца, чтобы он повторялся по мере прохождения цикла, например:

<div class="feedThm">
  <script type="text/javascript">
    replaceThm();
  </script>

  <img src="images/default-thm.jpg" alt="">


</div>

но безрезультатно.

Я также размещаю тег script в заголовке (в отличие от нижнего колонтитула, где я всегда помещал его), и тоже не идет.

Когда я перезагружаю страницу, большой палец просто исчезает ИЛИ сохраняет значок по умолчанию.

Надеюсь, это понятно. Кто-нибудь знает, как я могу это сделать? я близко! Я знаю это! ржу не могу.

Любая помощь приветствуется. Заранее благодарю.


person somdow    schedule 22.03.2015    source источник
comment
$('.feedContActual').find("img").attr("src") получит атрибут src из первого изображения в первом элементе .feedContActual. Вам нужно быть более конкретным с вашим селектором, чтобы он нацеливался только на элемент, который вы в данный момент повторяете. (Предполагая, что есть какая-то итерация, поскольку вы хотите, чтобы это работало с несколькими сообщениями… но вы не показали нам, как вы на самом деле вызываете эту функцию.)   -  person CBroe    schedule 22.03.2015
comment
В этом проблема @CBroe. Я не знаю, откуда вызвать мою функцию. Я поместил функцию replaceThm() в заголовок над телом, но она не работает. Я думал добавить его в сам div, но, насколько я знаю, вы не можете добавлять такие события загрузки, так что вот где я застрял   -  person somdow    schedule 22.03.2015
comment
Насколько мне известно, я знаю, как добавить его один раз, но не тогда, когда он рекурсивный (или зацикленный). Вот где мне нужна помощь   -  person somdow    schedule 22.03.2015
comment
Я отредактировал свой пост выше, чтобы дать вам некоторое представление о том, как я вызывал функцию.   -  person somdow    schedule 22.03.2015
comment
Вы пытаетесь получить миниатюру для каждого канала? то есть представление канала? Или вы пытаетесь получить разные эскизы для каждого элемента ленты?   -  person Revent    schedule 24.03.2015


Ответы (1)


Я действительно решил этот более глубокий обход jquery dom. Теги изменились, но, по сути, он делает то, что мне нужно (как описано в моем исходном вопросе). Поместите это здесь для тех, кто нуждается в подобном решении

$('.feedContBox').each(function(){
    var src = $(this).find('.feedContActual img:first').attr('src');
    $(this).find('.myThmDiv img').attr('src', src);
});
person somdow    schedule 24.03.2015