Come posso verificare se esiste già un'opzione in select di JQuery

169

Come posso verificare se esiste già un'opzione in select di JQuery?

Voglio aggiungere dinamicamente le opzioni in select e quindi ho bisogno di verificare se l'opzione è già esistente per impedire la duplicazione.

jquery

— manganello
fonte

333

Ciò viene considerato vero se esiste già:

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

— Tamas Czinege
fonte

5

Aggiornamento a Jquery 1.6 +, racchiudi il tuo valore tra virgolette

— Bob

1

Sì. Le citazioni sono molto importanti.

— Bobetko,

2

Funziona per me in jquery 1.7.1 senza racchiudere il tuo valore tra virgolette

— Mathias F

Come si può ignorare case o toLowerCase nella soluzione sopra? Ciò richiederebbe un $ .each per l'elenco a discesa?

— Ben Sewards,

1

se vogliamo implementare la corrispondenza con distinzione tra maiuscole e minuscole, allora cosa dobbiamo fare? usare la semplice funzione $ .each?

— Chaudhry Waqas,

21

Un altro modo di usare jQuery:

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

— HaMinh Nguyen
fonte

6

-1 In pratica stai facendo il ciclo da solo invece di lasciare che jQuery lo faccia come tutte le altre risposte. Anche se funzionerebbe, reinventa la ruota.

— Peter

14

non sono sicuro che sia -1 degno. questo mostra esplicitamente il processo, che può essere utile per i principianti. Certamente non è la risposta migliore, ma è valida.

— roberthuttinger,

1

E ad alcuni piace l'approccio manuale, come me. Questo combina anche il passaggio di aggiungere il booleano lì dentro, invece di produrre lo 0 o 1 come l'altro e di convertirlo. Dico che entrambi gli approcci vanno bene perché devi fare 2 passaggi, in entrambi i casi. Questo sembra più visibile al processo, a me, e meno soggetto all'errore non giudicando la lunghezza dello spazio bianco, per esempio, come .lengthpotrebbe fare.

— vapcguy,

3

Più uno per questi, inoltre non devi preoccuparti per i personaggi in YourValue

— Fabio C.

1

Questa e la risposta di alnort29 sono in realtà il modo migliore per verificare la presenza di un valore esistente, se non si conosce quale sia "yourValue" (ad esempio, se è l'input dell'utente). La creazione di una singola stringa solo per consentire a "jQuery di farlo" richiederebbe di eseguire la sanificazione dell'input e si finirà con pratiche di codice che perseguitano SQL da decenni. Quindi un -1 è completamente ingiustificato. La domanda afferma anche che vogliono inserire valori "dinamicamente". Non mettere insieme la stringa in modo dinamico. Inoltre, non selezionare '1 tra gli utenti in cui password = "' + stringa + '"', vero?

— Aaa,

20

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

— seb
fonte

2

ti manca una parentesi di chiusura "opzione [value = <enter_value_here>]"

— KB.

17

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

Questo ha il vantaggio di sfuggire automaticamente al valore per te, il che rende molto più facili da gestire le citazioni casuali nel testo.

— alnorth29
fonte

2

Non funziona, devi fare questo:

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

— Mike
fonte

1

Mi aiuta:

  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
fonte

0

Ho avuto un problema simile. Piuttosto che eseguire la ricerca attraverso la dom ogni volta che attraverso il ciclo per il controllo di selezione ho salvato l'elemento jquery select in una variabile e ho fatto questo:

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

— codeasaurus
fonte

0

Anche se la maggior parte delle altre risposte ha funzionato per me, ho usato .find ():

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

— Strabek
fonte