0

这是功能：

$('.entry-title').each(function() {
    var dotdotdot = $(this).html().indexOf('…'); 
    $(this).html('<a href="<?php the_permalink(); ?>"><span class="category">' + $(this).html().substring(0, dotdotdot) + '</span>' + $(this).html().substring(dotdotdot) + '</a>');
});

最初的意图是在标题本身的文本中添加一个 span 标签，效果很好（感谢@making3）。该代码<a href="<?php the_permalink(); ?> + '</a>'是我后来添加到原始函数中的。

我想做的是在标题周围加上一个链接，这样它将链接到单个帖子页面。棘手的部分是这些标题在页面上的每个帖子中向后循环，并为每个帖子创建多个空链接。只有最后一个链接有标题，但它不是该标题的正确链接。很明显，我所做的是完全错误的。

这是我的标记：

<article <?php post_class(); ?>>
<script>
$('.entry-title').each(function() {
    var dotdotdot = $(this).html().indexOf('…'); 
    $(this).html('<a href="<?php the_permalink(); ?>"><span class="category">' +     $(this).html().substring(0, dotdotdot) + '</span>' + $(this).html().substring(dotdotdot) + '</a>');
});
</script>
  <header>
    <h2 class="entry-title"><?php the_title(); ?></h1>
  </header>
  <div class="entry-summary">
    <div class="entry">
      <?php the_content(); ?>
    </div>
  </div>
</article>

有人可以帮忙吗？

4

1 回答 1

0

看起来好像您已按如下方式修改了 jQuery 代码：

<script>
$('.permalink').each(function() {
    var dotdotdot = $(this).html().indexOf('…'); 
    $(this).html('<span class="category">' + $(this).html().substring(0, dotdotdot) + '</span>' + $(this).html().substring(dotdotdot));
});
</script>

我敢肯定这在页面上看起来不错，但在幕后您正在为每个帖子输出该 jQuery 代码，并且由于它执行 .each 函数，因此它对代码的每个实例中的每个帖子都进行操作，从而导致多个嵌套的跨度标签.

现在，您的 HTML 正在通过 jQuery 呈现如下：

<h2 class="entry-title"><a href="/crushing-on/crushing-on-making-a-change/" class="permalink"><span class="category"><span class="category"><span class="category"><span class="category"><span class="category"><span class="category">Crushing on</span></span></span></span></span></span>…making a change</a></h2>

（右键单击 chrome 中的元素并单击检查元素以亲自查看）

发生这种情况是因为 jQuery 代码的多个实例，当您只希望一个实例对所有链接进行操作时。为了解决这个问题，将这个 jQuery 代码块放在生成帖子的 PHP 循环之外的页面顶部，这样它只会得到一次输出。

于 2013-08-15T00:55:04.690 回答