OL 李编号问题

OL li numbering issue

本文关键字：问题 编号 李编号 OL      更新时间：2023-09-26

我有以下排序列表：

<ol>     
    <li>First</li>
    <li>Second</li>
    <li>Third</li>
</ol>

我必须一次显示一个 li，这是我使用"display"属性执行的。问题是，无论显示哪个 li，列表编号都显示 1。所以而不是"2.第二"或"3.第三"我看到"1.第二"，"1.第三"等。

查看问题（不清楚）和您的小提琴，似乎您希望隐藏的div 保留其列表订单号并可见以显示其各自的列表编号，而不是从 1 重新开始。这对于 jquery .hide() 和 .show() 是不可能的，因为它们使用更改列表序号的显示属性。您需要使用可见性。

尝试

$('li').not(':eq(2)')
          .css('height', '0px') //Use this only if you dont want to show the lists that are hidden because visibility takes space in the page flow.
          .end().filter(':eq(2)')
          .css('visibility', 'visible');

和一个 CSS

ol li {
    visibility : hidden; /*Or just use jquery to set the css to visibility hidden*/
}

小提琴

我从你的问题I've to display one li at a time了解到，你可以用start属性从某个索引开始。

<ol>
    <li>First</li> <!-- 1 -->
    <li>Second</li> <!-- 2 -->
    <li>Third</li> <!-- 3 -->
</ol>
<ol>
    <li>First</li> <!-- 1 (default)-->
</ol>
<ol start="2">
    <li>Second</li> <!-- 2 -->
</ol>
<ol start="3">
    <li>Third</li> <!-- 3 -->
</ol>
<ol start="50">
    <li>Fifty</li>
    <li>Fifty One</li>
</ol>

演示。

更新：

$('li').hide();
var index = 2, li = $('li').eq(index);
li.closest('ol').attr('start', index+1).find(li).show();

演示。

更新：（制作函数）

function hideLiByIndex(i)
{
    $('li').hide();
    li = $('li').eq(i);
    li.closest('ol').attr('start', i+1).find(li).show();
}
hideLiByIndex(1);

演示。

尝试使用

visibility: hidden;

并将其更改为

visibility: visible;

当您希望显示它时

jQuery

要显示：

$(element).css("visibility","visible");

要隐藏：

$(element).css("visibility","hidden");
相关文章：