Question

我有以下列表：

<ul>
  <li>
    <input name="tablefilter" type="checkbox" value="Finspång" id="tablefilter1" checked="">Finspång
  </li>
  <li>
    <input name="tablefilter" type="checkbox" value="Linköping" id="tablefilter1" checked="">Linköping
  </li>
  <li>
    <input name="tablefilter" type="checkbox" value="Linköping" id="tablefilter1" checked="">Linköping
  </li>
</ul>

如您所见，我有两个<li>同名“Linköping”。

有没有办法让它只显示唯一值？

Answer 1

只需将其从源代码中删除即可。所以你将拥有：

<ul>
    <li>
        <input name="tablefilter" type="checkbox" value="Finspång" id="tablefilter1" checked="">Finspång
    </li>
    <li>
        <input name="tablefilter" type="checkbox" value="Linköping" id="tablefilter1" checked="">Linköping
    </li>
</ul>

您还可以使用关键字hidden

<ul>
    <li>
        <input name="tablefilter" type="checkbox" value="Finspång" id="tablefilter1" checked="">Finspång
    </li>
    <li>
        <input name="tablefilter" type="checkbox" value="Linköping" id="tablefilter1" checked="">Linköping
    </li>
    <li hidden >
        <input name="tablefilter" type="checkbox" value="Linköping" id="tablefilter1" checked="">Linköping
    </li>
</ul>

要显示唯一值而不向html代码添加任何内容，您可以使用jquery。

https://jsfiddle.net/8sm6j9kk/

请参阅此帖子以获得解释 JQuery: Remove duplicate elements?

说明：

看到的是一个将任何以前看到的文本映射为true的对象。它   作为包含所有先前看到的文本的集合。该行如果   （见[txt]）检查文本是否在集合中。如果是这样，我们已经看到了   之前的这篇文章，所以我们删除了链接。否则，这是一个链接   我们第一次看到的文字。我们将它添加到集合中以便任何   将删除具有相同文本的其他链接。

表示集合的另一种方法是使用包含的数组   所有价值观。然而，这会使它变慢，因为看看是否   value是我们每次扫描整个数组所需的数组。   使用see [txt]查找对象中的键非常快   比较。

如何隐藏<li>中的冗余元素

1 个答案: