javascript - 检查列表元素中的重复名称

Question

问题:

如何检查列表元素中的重复名称/项目？

我的情况:

我有一个列表中的列表，这是一个例子:

<ol class="sortable ui-sortable">
<li id="category_1"><div>Car</div>
   <ol>
       <li id="category_2"><div>Color</div>
            <ol>
                <li id="category_3"><div>Red</div></li>
                <li id="category_4"><div>Black</div></li>
            </ol>
       </li>
   </ol>
</li>
<li id="category_5"><div>Motor</div>
   <ol>
       <li id="category_6"><div>Red</div></li>
       <li id="category_7"><div>Black</div></li>
   </ol>
</li>
<li id="category_9"><div>Truck</div></li>
</ol>

class="sortable ui-sortable"正在使用的是 NestedSortable jQuery Plugin .所以列表项是可拖动的。

当 div 被拖到另一个列表中时，我想检查这些 div 中的名称 <ol> .如果此列表包含重复项，它将以红色突出显示。

例如，如果我拖动 Red - category_6到 ol在 Color 内- category_2 ，其中已经包含一个红色，该位置 (dropspot) 变为红色。如果用户决定仍将其放在该位置，列表将返回到其原始位置。 category_6将移回 ol下面category_5 .

所以列表可能会像这样结束，或者如果你有更好的方法的话:

<ol class="sortable ui-sortable">
<li id="category_1"><div>Car</div>
   <ol>
       <li id="category_2"><div>Color</div>
            <ol>
                <li id="category_3"><div>Red</div></li>
                <li id="category_4"><div>Black</div></li>
                <li id="category_6" class="HIGHLIGHTED"><div>Red</div></li>
            </ol>
       </li>
   </ol>
</li>
<li id="category_5"><div>Motor</div>
   <ol>
       <li id="category_7"><div>Black</div></li>
   </ol>
</li>
<li id="category_9"><div>Truck</div></li>
</ol>

Answer 1

考虑我的列表是

<ul id="myid">
    <li>apple</li>
    <li>ibm</li>
    <li>apple</li>
    <li>microsoft</li>
    <li>ibm</li>
</ul>

我建议的查找重复项的脚本是

var liText = '',
liList = $('#myid li'),
listOfDuplicate = [];
$(liList).each(function () {
var text = $(this).text();
if (liText.indexOf('|' + text + '|') == -1) liText += '|' + text + '|';
else listOfDuplicate.push($(this));
});

$(listOfDuplicate).each(function () {
     alert("Duplicates :  " + $(this).text());
});

示例使用 fiddle