如何從select元素中刪除具有相同文本的選項？

Question

我有顯示文字相同的多個選項的選擇元件：

<select name="tur" id="tur"> 
     <option value="1">a</option> 
     <option value="2">a</option> 
     <option value="3">a</option> 
     <option value="4">a</option> 
     <option value="5">b</option> 
     <option value="6">b</option> 
     <option value="7">c</option> 
     <option value="8">d</option>   
      </select> 

使用JavaScript，我想刪除這些重複，使得僅在每個示出一個：

<select name="tur" id="tur"> 
     <option value="1">a</option> 
     <option value="5">b</option> 
     <option value="7">c</option> 
     <option value="8">d</option>   

Answer 1

var remove = [], values = {}, value, i; 
var options = document.getElementById('tur').getElementsByTagName('option'); 
for (i=0; i<options.length; i++) { 
    value = options[i].innerHTML.replace(/^\s*|\s*$/g, ''); 
    if (value in values) remove.push(options[i]); 
    else values[value] = true; 
} 

for (i=0; i<remove.length; i++) { 
    remove[i].parentNode.removeChild(remove[i]); 
} 

Answer 2

您可以遍歷<option>元素，檢查每個元素以查看其文本內容是否在數組中。如果是，請刪除<option>。如果不是，則將其內容添加到數組中。這將刪除列表中冗餘的選項。

試試看：http://jsfiddle.net/FXq8W/

​var array = []; 

​$('#tur option').each(function() { 
    var $th = $(this); 
    var text = $th.text(); 
    if($.inArray(text, array) > -1) { 
     $th.remove(); 
    } else { 
     array.push(text); 
    } 
});​​​​​​​​​​​​​​ 

• http://api.jquery.com/jquery.inarray/