<ol> 标签在 HTML 中的 'for' 循环中使用时不会从 1 开始递增并保持为 1

<ol> tag doesn't increment from 1 and stays at 1 while using in a 'for' loop in HTML

首先,我对HTML一无所知。我正在尝试使用 Jekyll 构建一个网站,并找到了一个网站模板,我正在对其进行修改。

我有以下代码:

{% for publi in site.data.publist %}

{% assign even_odd = number_printed | modulo: 2 %}

{% if even_odd == 0 %}
<div class="row">
{% endif %}

<div>
  <ol>
  <li>{{ publi.title }}</li>
    <!--   <img src="{{ site.url }}{{ site.baseurl }}/images/pubpic/{{ publi.image }}" class="img-responsive" width="33%" style="float: left" />
 -->  <p>{{ publi.description }}</p>
  <p><em>{{ publi.authors }}</em></p>
  <p><strong><a href="{{ publi.link.url }}">{{ publi.link.display }}</a></strong></p>
  <!-- <p class="text-danger"><strong> {{ publi.news1 }}</strong></p>
  <p> {{ publi.news2 }}</p> -->
  </ol>
</div>

{% assign number_printed = number_printed | plus: 1 %}

{% if even_odd == 1 %}
</div>
{% endif %}

{% endfor %}

site.data.publist 中有一个 YAML 文件,其中有许多成员,每个成员都有不同的字段。 for 循环有助于遍历 YAML 文件的所有成员。

正如您在代码中看到的,我在 for 循环中使用了 <ol> 标签,并且我已经将 <li> 标签用于publi.title(YAML 文件成员中的一个字段)。但我得到的只是对 YAML 文件中的所有成员重复一次。 I have attached the output I get.

作为 ,您正在生成无效的 HTML。 首先,<ol> 可能只包含 li 作为直接子代。因此,请确保将其他所有内容也放在 li 标签内。

但您真正的问题是您在 循环中生成了 ol 标签 。如评论中所述,您的输出包含 multiple 列表,每个列表有一个元素,而不是 one list with n elements.

为了改变这一点,您必须将 ol 移到 for 循环之外。 (然后确保您仍然生成有效的 HTML => 请参阅第 1 点。)