Simplepie rss 缺少缩略图，使用 jQuery 的替代解决方案答案

【问题标题】：Simplepie rss missing thumbnail, alternate solution using jQuerySimplepie rss 缺少缩略图，使用 jQuery 的替代解决方案
【发布时间】：2015-03-22 14:01:37
【问题描述】：

我在从 simplepie rss 中提取缩略图时遇到问题。我已经查看了所有内容，包括这里，但似乎无法找到一个有效的解决方案。特别是因为我想要所有提要及其线程的缩略图。

这就是说，我决定做的是，使用 jquery，在 rss 内容 div 中搜索 img 源，将该源字符串保存到变量中，然后使用该值填充我设置的另一个 div专门用于缩略图。几乎所有帖子都有图片，所以应该没问题。

我得到了它的工作，但有一部分我无法将我的大脑包裹起来。 rss 通过 for 循环通过 php 输入到页面中。为了测试应用程序，我一次提取 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

我明白它为什么这样做，但我不知道如何像 php 那样制作 jQuery 代码循环。我尝试将“脚本”块插入拇指 div，以便在循环进行时进行迭代，如下所示：

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

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


</div>

但无济于事。

我还将脚本标签放在页眉上（与我总是放它的页脚相反），也不行。

当我重新加载页面时，拇指会消失或保留默认图标。

希望这很清楚。任何人都知道我该如何做到这一点？快到了！我知道！哈哈。

感谢您提供任何帮助。提前谢谢你。

【问题讨论】：

$('.feedContActual').find("img").attr("src") 将从第一个 .feedContActual 元素中的第一个图像中获取 src 属性。您需要更具体地使用您的选择器，以便它仅针对您当前正在迭代的元素。（假设有某种迭代，因为您希望它适用于多个帖子……但您还没有向我们展示您实际上是如何调用该函数的。）
这就是问题@CBroe。我不知道从哪里调用我的函数。我已将函数“replaceThm()”放在正文上方的标题上，但不起作用。我正在考虑将它添加到 div 本身内联但是，据我所知，你不能添加这样的 onload 事件，所以这就是我卡住的地方
据我所知，我知道如何添加一次，但在递归（或循环）时不知道。这就是我需要帮助的地方
我在上面编辑了我的帖子，让您了解我是如何调用该函数的。
您是否要为每个提要获取缩略图？即提要的表示？或者您是否尝试为每个提要项获取不同的缩略图？

标签： php jquery html simplepie

【解决方案1】：

我实际上解决了这个更深层次的 jquery dom 遍历。标签发生了变化，但基本上它做了我需要它做的事情（如我原来的问题中所述）。把它放在这里给任何需要类似解决方案的人

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

【讨论】：