Come posso velocizzare jquery: selettore selezionato?
-
23-08-2019 - |
Domanda
Ho un menu a discesa in una pagina web con 3830 elementi in esso. Lo so, ma qualunque sia eccessiva.
In jQuery ottengo il valore dell'opzione selezionata utilizzando l'istruzione:
$ ( "#institutionCombo: selezionato") .VAL ();
C'è una pausa evidente prima che venga trovata la selezione. Una volta che ho quel valore inserisco in una casella di testo sulla pagina, quindi so quanto velocemente. Inoltre ho controllato utilizzando i punti di interruzione in Firebug.
Se vado vecchia scuola e uso questo javascript:
var div = document.getElementById ( "maindiv");
var selezionare = div.getElementsByTagName ( "select") [0];
var ix = select.selectedIndex;
var = instid select.options [ix] .value;
Questa velocità è instananeous.
C'è qualcosa ereditare in jQuery che rende il: selezionato di selezione così lento quando i numeri diventano troppo alto? Mi piacerebbe restare con jQuery tutto nei miei scritti, qualcuno ha un suggerimento per velocizzare la ricerca l'opzione selezionata in jQuery?
Grazie,
Craig
Soluzione
Non c'è bisogno di chiamare il: selezionato quando ricevendo il val di una casella di selezione
.Il comportamento predefinito è quello di ottenere il selectedIndex
$( "#institutionCombo").val();
Come notato nel commento, se avete bisogno di accedere al testo di tale opzione è possibile utilizzare
$( "#institutionCombo option[value=" + $( "#institutionCombo").val(); + "]").text();
anche se sai che hai bisogno la proprietà testo e il suo diverso dal valore che si può fare, a utilizzare direttamente il selectedIndex.
var combo = $("#institutionCombo").get(0);
combo = combo ? combo : {selectedIndex: -1}; // handle no combo returned
if (combo.selectedIndex < 0)
return; // nothing selected
$('#institutionCombo option:eq(' + combo.selectedIndex + ')').text()
Ecco il frammento di dall'origine jquery (v1.3)
val: function( value ) {
// ...
// We need to handle select boxes special
if ( jQuery.nodeName( elem, "select" ) ) {
var index = elem.selectedIndex,
values = [],
options = elem.options,
one = elem.type == "select-one";
// Nothing was selected
if ( index < 0 )
return null;
// Loop through all the selected options
for ( var i = one ? index : 0, max = one ? index + 1 : options.length; i < max; i++ ) {
var option = options[ i ];
if ( option.selected ) {
// Get the specifc value for the option
value = jQuery(option).val();
// We don't need an array for one selects
if ( one )
return value;
// Multi-Selects return an array
values.push( value );
}
}
return values;
// ...
},
Quando si chiama il: Selettore selezionato che sta ciclo tra tutti gli elementi di selezione decendents alla ricerca per la proprietà .selected da impostare e restituisce un array di qualsiasi. In entrambi i casi si esegue questa operazione sarà di loop tutte decendents, in modo da non farlo.
Altri suggerimenti
Si potrebbe fare questo:
var ix = $ ( "#institutionCombo") .attr ( "selectedIndex");
Valore var = $ ( "#institutionCombo opzione: eq (" + ix + ")") .VAL ();
, ma, questo è effettivamente quello che stai facendo nel codice della vecchia scuola.
Sono sorpreso che c'è un ritardo notevole, dal momento che avrei pensato che quello che sto facendo qui sopra è ciò che il codice jQuery sta facendo per il:. Selettore selezionato
In caso contrario, mi chiedo se si tratta di un errore di sintassi che sta causando il ritardo, si dovrebbe probabilmente essere facendo
$ ( "opzione #institutionCombo: selezionato") .VAL ();
(opzione nota: selezionato vs: selezionato)