问题:
如何检查列表元素中的重复名称/项目?
我的情况:
我有一个列表中的列表,这是一个例子:
<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>
最佳答案
考虑我的列表是
<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
关于javascript - 检查列表元素中的重复名称,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16084169/