javascript - 仅通过 javascript 从下拉列表中删除重复项

Question

我有一个从数据库动态创建的选择下拉字段。由于创建它的方式，它会导致下拉列表具有重复的项目和值。

<select id="locationList">
<option value="1">Andover</option>
<option value="2">Bishops waltham</option>
<option value="1">Andover</option>
<option value="3">Boscombe</option>
<option value="4">Bournemouth</option>
<option value="2">Bishops waltham</option>
<option value="4">Bournemouth</option>

</select>

有谁知道是否有办法在页面上使用一些代码来检查下拉列表中的重复项并仅通过 Javascript No Jquery 从菜单中删除重复项？

提前致谢，

阿比纳夫

标签： javascriptarrays

Answer 1

Javascript 有removeChild选项，您可以使用它来删除重复值：

var fruits = document.getElementById("locationList");

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

<select id="locationList">
<option value="1">Andover</option>
<option value="2">Bishops waltham</option>
<option value="1">Andover</option>
<option value="3">Boscombe</option>
<option value="4">Bournemouth</option>
<option value="2">Bishops waltham</option>
<option value="4">Bournemouth</option>
</select>