Como posso acelerar jquery: selector selecionado?

Question

Eu tenho uma lista suspensa em uma página web com 3830 elementos nele. Eu sei, mas o que quer excessiva.

Em jquery eu recebo o valor da opção selecionada usando a instrução:

$ ( "#institutionCombo: selecionado") .val ();

Há uma pausa perceptível antes da seleção é encontrado. Assim que eu receber esse valor eu inseri-lo em uma caixa de texto na página, então eu sei o quão rápido. Além disso, eu verifiquei-lo usando pontos de interrupção no Firebug.

Se eu for velha escola e usar este javascript:

var div = document.getElementById ( "maindiv");
var selecionar = div.getElementsByTagName ( "select") [0];
var ix = select.selectedIndex;
var instId = select.options [ix] .value;

Esta velocidade é instananeous.

Existe herdar algo em jquery que faz o: selector selecionado de modo lento quando os números ficam muito alto? Eu gostaria de ficar com jquery todo em meus scripts, alguém tem uma sugestão para acelerar a localização da opção selecionada em jQuery?

Obrigado,

Craig

Answer 1

Não há necessidade de chamar o:. Selecionada quando começar o val de uma caixa de seleção

O comportamento padrão é obter o selectedIndex

$( "#institutionCombo").val();

Como observado no comentário, Se você precisar acessar o texto dessa opção você pode usar

$( "#institutionCombo option[value=" + $( "#institutionCombo").val(); + "]").text();

embora se você sabe que você precisa a propriedade de texto e sua diferente do valor que você pode apenas querer usar o selectedIndex diretamente.

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()

Aqui está o trecho da fonte 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 você chamar o: selector selecionado que vai percorrer todos os elementos selecionados decendents olhando para a propriedade .selected a ser definido e irá retornar um array de qualquer. De qualquer maneira você fizer isso ele vai Loop Todas as decendents, então não fazer isso.

Answer 2

Você pode fazer isso:

var ix = $ ( "#institutionCombo") .attr ( "selectedIndex");

valor var = $ ( "#institutionCombo opção: eq (" + ix + ")") .val ();

mas, que é efetivamente o que você está fazendo em seu código old-school.

Eu estou surpreso que há um atraso perceptível, desde que eu teria pensado que o que estou fazendo acima é o que o código jQuery está fazendo para o:. Selector selecionado

Caso contrário, gostaria de saber se é um erro de sintaxe que está causando o atraso, você provavelmente deve estar fazendo

$ ( "opção #institutionCombo: selecionado") .val ();

(opção nota: selecionado vs: selecionado)