Question

我有一个select元素，显示多个具有相同文本的选项：

 <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

您可以遍历<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/

Answer 2

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]);
}

如何从select元素中删除具有相同文本的选项？

2 个答案: