从下拉列表中删除多个重复的选项

Question

与此问题类似here我想了解如何从下拉列表中删除重复的选项，但是我想映射一个ID列表以搜索并查看如果他们有重复的选项拼接出来，而不是只有一个输入选择器。

这方面的一个例子是如下：

<select id="MeatList"> 
<option value="OBgYN7" >Ham</option> 
<option value="ELmn5">Beef</option> 
<option value="KrUKt6">Chicken</option> 
<option value="OBgYN7" selected="selected">Ham</option> 
</select> 

<select id="Seats"> 
<option value="2" >Table For Two</option> 
<option value="3">Table For Three</option> 
<option value="5">Table for Five</option> 
<option value="10" >Party Table</option> 
</select> 

<select id="Lastname"> 
<option value="Tao" >The Tao's</option> 
<option value="Smith">The Smith's</option> 
<option value="Samuels">The Samuels'</option> 
<option value="Smith" >The Smith's</option> 
</select> 

正如你所看到的，MeatList和姓氏有重复值的投入，我希望能够搜索所有下拉重复值框（或内部文本）并将它们拼接在一起。这是可能的通过某种映射？

的代码中使用将是：

[].slice.call(fruits.options) 
    .map(function(a){ 
    if(this[a.innerText]){ 
     if(!a.selected) fruits.removeChild(a); 
    } else { 
     this[a.innerText]=1; 
    } 
    },{}); 

而且得到我的意思通过映射下拉列表的想法，我会用这样的代码：

var idlist= ["MeatList", "Seats", "Lastname"]; 
    var handlelists = idlist.join("|"); 
    [].slice.call(handlelists.options) 
     .map(function(a){ 
     if(this.search([a.innerText])){ 
      if(!a.selected) handlelists.removeChild(a); 
     } else { 
      this[a.innerText]=1; 
     } 
     },{}); 

Answer 1

不知道你以为你在脚本的handleLists部分发生了什么。在找到与这些ID相对应的元素之后，您只需要将其他段包装在迭代器中（forEach）。

var idList= ["MeatList", "Seats", "Lastname"].map(function(id){return document.getElementById(id)}); 

idList.forEach(function(select){ 
    [].slice.call(select.options) 
    .map(function(a){ 
    if(this[a.value]){ 
     select.removeChild(a); 
    } else { 
     this[a.value]=1; 
    } 
    },{}); 
}); 

当然，这是不好的。你应该去复制它自己的功能，例如：

function deDuplicate(select){ 
    [].slice.call(select.options) 
    .map(function(a){ 
     if(this[a.value]){ 
     select.removeChild(a); 
     } else { 
     this[a.value]=1; 
     } 
    },{}); 
} 

然后：

var idList= ["MeatList", "Seats", "Lastname"].map(function(id){return document.getElementById(id)});  
idList.forEach(function(select){ deDuplicate(select); }); 

我个人建议学习/使用CoffeeScript的，因为它uncrufts的Javascript很大的重复数据删除是这样的：

deDuplicate = (select)-> 
    [].slice.call(select.options).map (a)-> 
    if @[a.value] 
     select.removeChild a 
    else 
     @[a.value] = 1 
    , {} 

再包，你可以这样做：

deDuplicate select for select in ["MeatList", "Seats", "Lastname"].map (id)-> 
    document.getElementById id 

这更清楚地表达为英语，至少对我来说它确实如此。一如既往YMMV。