Question

我试图像这样翻译标题：

Greetings

Introductions

Numbers

(etc.)

进入这个：

1. Greetings

2. Introductions

3. Numbers

(etc.)

所以我写了这个：

  var outlineCount = 0
  $('.page-template-page-outline .entry-content > h2').prepend('<span class="lesson-number">' + outlineCount++ + '.</span> ')

但我得到的是：

0. Greetings

0. Introductions

0. Numbers

(etc.)

我做错了什么？

Answer 1

您没有循环遍历每个元素，然后预先添加内容。您正在做的是将其应用于 jQuery集合中的所有元素。

因此，0的值outlineCount只会是1后缀运算符之后的++。

$('.page-template-page-outline .entry-content > h2').each(function(i) {
   $(this).prepend('<span class="lesson-number">' + (i + 1) + '.</span>')
});

在上面的代码中，我们使用的索引在回调中传递并向其中添加一个。不需要单独的柜台。

Answer 2

你正在使用＆＃34; const＆＃34;字符串为'<span class="lesson-number">' + 0 + '.</span> '你必须知道前缀只会在你的代码中被调用一次。

这可能是解决方案

var outlineCount = 0
$('.page-template-page-outline .entry-content > h2').each(function(){
    $(this).prepend('<span class="lesson-number">' + outlineCount++ + '.</span> ');
})

Answer 3

传递给prepend方法的参数在调用方法之前解析;即。

'<span class="lesson-number">' + outlineCount++ + '.</span> '

解决了：

'<span class="lesson-number">0.</span> '

然后添加到与CSS选择器'.page-template-page-outline .entry-content > h2'匹配的每个元素。

您需要迭代为方法返回的每个元素，例如

$('.page-template-page-outline .entry-content > h2').each(function ( index, element ) {
    element.prepend('<span class="lesson-number">' + ++outlineCount + '.</span> ');
});

Answer 4

它可能是偏离主题的，因为它没有回答您遇到的问题（并且通过之前的响应回答），但是您可以使用<ol>元素来获取自动编号列表，并提供帮助wrap和wrapInner jquery函数将其插入现有页面中。

然而，最好的解决方案应该是直接更改html，如果你有可能：

<div class="entry-content">
  <ol>
    <li><h2>Greetings</h2></li>
    <li><h2>Introductions</h2></li>
    <li><h2>Numbers</h2></li>
  </ol>
</div>

$('.page-template-page-outline .entry-content ').wrapInner('<ol></ol>');
$('.page-template-page-outline .entry-content > ol > h2 ').wrap('<li></li>');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="page-template-page-outline">
  <div class="entry-content">
    <h2>Greetings</h2>
    <h2>Introductions</h2>
    <h2>Numbers</h2>
  </div>
</div>

用count ++做前置

4 个答案: