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和Lastname具有重复值，我希望能够在所有下拉框中搜索重复值（或内部文本）并将它们拼接出来。通过某种映射可以实现吗？

要使用的代码是：

[].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。

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

1 个答案: