識別重複的值與jQuery

Question

假設我有這樣的

<ul> 
<li>Item 1</li> 
<li>Item 2</li> 
<li>Item 3</li> 
<li>Item 1</li> 
</ul> 

列表使用jQuery我怎麼能確定何時值重複。 我的意圖是給重複值一個替代的風格。

Answer 1

您可以遍歷所有<li>對象，獲取它們的文本並將其收集到您用作索引的對象中（以提高效率）。完成後，查看哪些項目具有超過一個給定文本的元素，並向它們添加特殊類。出於效率原因，此解決方案使用對象來構建索引。該代碼是這樣的：

HTML：

<ul id="list"> 
<li>Item 1</li> 
<li>Item 2</li> 
<li>Item 3</li> 
<li>Item 1</li> 
</ul>​ 

的Javascript評論：

(function() { 
    var index = {}; 
    $("#list li").each(function() { 
     var text = $(this).text(); 
     // if this text not in the index yet, create an array for it 
     if (!(text in index)) { 
      index[text] = []; 
     } 
     // add this item to the array 
     index[text].push(this); 
    }); 
    // cycle through the index and find each item that has more than one DOM element 
    $.each(index, function() { 
     // "this" will be an array of DOM nodes 
     if (this.length > 1) { 
      $(this.slice(1)).addClass("duplicates"); 
     } 
    }); 
})();​ 

工作演示：http://jsfiddle.net/jfriend00/zDhjD/

Answer 2

$("ul li").each(function(){ 
    var val = $(this).text(); 
    $("ul li").not(this).each(function(){ 
    if($(this).text() == val){ 
    $(this).addClass("mystyle"); 
    } 
    }); 
}); 

http://jsfiddle.net/tscRG/

Answer 3

試試這個：

​$('ul > li')​.each(function(){ 
    var current = this; 
    $('ul').find('li:contains(' + $(this).html() + ')').each(function(){ 
     if(current != this) { 
      $(this).css('color', 'red'); 
     } 
    }); 
});​ 

Demo上的jsfiddle