Wie kann ich überprüfen, ob in select by JQuery bereits eine Option vorhanden ist?

169

Ich möchte dynamisch Optionen zu select hinzufügen und muss daher prüfen, ob die Option bereits vorhanden ist, um eine Duplizierung zu verhindern.

jquery

— Billy
quelle

333

Dies wird als wahr ausgewertet, wenn es bereits vorhanden ist:

$("#yourSelect option[value='yourValue']").length > 0;

— Tamas Czinege
quelle

5

Wenn Sie ein Upgrade auf Jquery 1.6 + durchführen, schließen Sie Ihren Wert in Anführungszeichen ein

— Bob

1

Ja. Zitate sind sehr wichtig.

— Bobetko

2

Funktioniert für mich in jquery 1.7.1, ohne Ihren Wert in Anführungszeichen zu setzen

— Mathias F

Wie kann Groß- / Kleinschreibung ignorieren oder toLowerCase in der obigen Lösung implementiert werden? Wäre hierfür ein $ .each für die Dropdown-Liste erforderlich?

— Ben Sewards

1

Was müssen wir tun, wenn wir Matching zwischen Groß- und Kleinschreibung implementieren möchten? Verwenden Sie die einfache Funktion $ .each?

— Chaudhry Waqas

21

Eine andere Möglichkeit, jQuery zu verwenden:

var exists = false; 
$('#yourSelect  option').each(function(){
  if (this.value == yourValue) {
    exists = true;
  }
});

— HaMinh Nguyen
quelle

6

-1 Sie führen die Schleife im Grunde selbst durch, anstatt jQuery wie alle anderen Antworten ausführen zu lassen. Obwohl dies funktionieren würde, wird das Rad neu erfunden.

— Peter

14

Ich bin mir nicht sicher, ob es -1 wert ist. Dies zeigt explizit den Prozess, der für Anfänger gut sein kann. Sicher nicht die beste Antwort, aber es ist eine gültige.

— Roberthuttinger

1

Und manche mögen den manuellen Ansatz, wie ich. Dies kombiniert auch den Schritt des Hinzufügens des Booleschen Werts, anstatt die 0 oder 1 wie die andere zu erzeugen und sie konvertieren zu müssen. Ich sage, beide Ansätze sind in Ordnung, weil Sie in beiden Fällen zwei Schritte ausführen müssen. Dies scheint für den Prozess für mich sichtbarer und weniger fehleranfällig zu sein, wenn beispielsweise die Länge des Leerzeichens nicht beurteilt wird, wie dies .lengthmöglicherweise der Fall ist .

— Vapcguy

3

Plus eins für diese, auch müssen Sie sich nicht um Charaktere in Ihrem Wert kümmern

— Fabio C.

1

Dies und die Antwort von alnort29 sind der beste Weg, um nach einem vorhandenen Wert zu suchen, wenn Sie nicht wissen, was "yourValue" ist (z. B. wenn es sich um Benutzereingaben handelt). Wenn Sie eine einzelne Zeichenfolge erstellen, damit "jQuery dies tut", müssen Sie die Eingabe bereinigen, und am Ende werden Code-Praktiken angewendet, die SQL seit Jahrzehnten verfolgen. Ein -1 ist also völlig ungerechtfertigt. Die Frage besagt sogar, dass sie Werte "dynamisch" einfügen wollen. Patchen Sie Ihre Saite nicht dynamisch zusammen. Sie wählen auch nicht '1 aus Benutzern aus, bei denen password = "' + string + '"', oder?

— Aaa

20

if ( $("#your_select_id option[value=<enter_value_here>]").length == 0 ){
  alert("option doesn't exist!");
}

— Seb
quelle

2

Ihnen fehlt eine schließende Klammer "Option [value = <enter_value_here>]"

— KB.

17

var exists = $("#yourSelect option")
               .filter(function (i, o) { return o.value === yourValue; })
               .length > 0;

Dies hat den Vorteil, dass der Wert für Sie automatisch ausgeblendet wird, wodurch zufällige Anführungszeichen im Text viel einfacher zu handhaben sind.

— alnorth29
quelle

2

Funktioniert nicht, müssen Sie dies tun:

if ( $("#your_select_id option[value='enter_value_here']").length == 0 ){
  alert("option doesn't exist!");
}

— Mike
quelle

1

Es hilft mir:

  var key = 'Hallo';

   if ( $("#chosen_b option[value='"+key+"']").length == 0 ){
   alert("option not exist!");

    $('#chosen_b').append("<option value='"+key+"'>"+key+"</option>");
    $('#chosen_b').val(key);
   $('#chosen_b').trigger("chosen:updated");
                         }
  });

— Sulung Nugroho
quelle

0

Ich hatte ein ähnliches Problem. Anstatt die Suche durch den Dom jedes Mal durch die Schleife für das Auswahlsteuerelement auszuführen, habe ich das jquery select-Element in einer Variablen gespeichert und dies getan:

function isValueInSelect($select, data_value){
    return $($select).children('option').map(function(index, opt){
        return opt.value;
    }).get().includes(data_value);
}

— Codeasaurus
quelle

0

Obwohl die meisten anderen Antworten für mich funktionierten, habe ich .find () verwendet:

if ($("#yourSelect").find('option[value="value"]').length === 0){
    ...
}

— Strabek
quelle