Löschen von doppelten Einträgen aus einer Auswahlbox

Question

Wie würde ich, jQuery verwenden, die dups entfernen

 <option value="English">English</option> 
     <option value="English">English</option> 
     <option value="English">English</option> 
     <option value="Geology">Geology</option> 
     <option value="Geology">Geology</option> 
     <option value="Information Technology">Information Technology</option> 
     <option value="Music">Music</option> 
     <option value="Music">Music</option> 
     <option value="Zoology">Zoology</option> 

Answer 1

Sie können es wie folgt tun:

var found = []; 
$("select option").each(function() { 
    if($.inArray(this.value, found) != -1) $(this).remove(); 
    found.push(this.value); 
}); 

Give it a try here, es ist ein einfacher Ansatz, wir re nur eine Reihe von gefundenen Werten zu halten, wenn wir den Wert nicht gefunden haben, fügen sie es den Array (.push()), wenn wir den Wert gefunden haben, ist dies ein Betrogene wir früher gefunden, .remove() es.

Dies crawlt nur einmal die <select>, minimiert DOM Traversal, die eine Los teurer als Array-Operationen ist. Auch verwenden wir $.inArray() statt .indexOf() so das funktioniert richtig im Internet Explorer.

---

Wenn Sie eine weniger effizient, aber kürzere Lösung wollen (nur zur Veranschaulichung, verwenden Sie die erste Methode!):

$('select option').each(function() { 
    $(this).prevAll('option[value="' + this.value + '"]').remove(); 
}); 

You can test it here, das alle Geschwister mit dem gleichen Wert entfernt, aber es ist viel mehr teurer als die erste Methode (DOM Traversal ist teuer, und mehrere Selector-Engine-Aufrufe hier, viele mehr). Wir verwenden .prevAll(), weil Sie nicht nur .siblings() innerhalb eines .each() entfernen, wird es einige Fehler mit der Schleife verursachen, da es das nächste Kind erwartet.

Answer 2

Der einfachste Weg, die mir in den Sinn kam, wurde mit Geschwistern

$("select>option").each(function(){ 

var $option = $(this); 

$option.siblings() 
     .filter(function(){ return $(this).val() == $option.val() }) 
     .remove() 


}) 

Answer 3

Von oben aus meinem Kopf, nicht getestet:

$('#mySelect option').each(function(){ 
    if ($('#mySelect option[value="'+$(this).val()+'"]').length) $(this).remove(); 
}); 

Answer 4

try Code unten doppelte Optionen zu entfernen:

$("#color option").val(function(idx, val) { 
 
    $(this).siblings("[value='"+ val +"']").remove(); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<select class ="select-form" name="color" id="color"> 
 
    <option value="">Select Color</option> 
 
    <option value="1">Color 1</option> 
 
    <option value="2">Color 2</option> 
 
    <option value="3">Color 3</option> 
 
    <option value="3">Color 3</option> <!-- will be removed since value is duplicate --> 
 
    <option value="2">Color 2</option> <!-- will be removed since value is duplicate --> 
 
</select>