3

3830 個の要素を含む Web ページにドロップダウンがあります。私は知っています、過度ですが、何でも。

jquery では、次のステートメントを使用して、選択したオプションの値を取得します。

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

選択が見つかる前に、顕著な一時停止があります。その値を取得したら、それをページのテキスト ボックスに挿入するので、どれだけ速いかがわかります。さらに、Firebug のブレークポイントを使用して確認しました。

古い学校に行き、このjavascriptを使用すると:

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

このスピードは一瞬です。

数値が高くなりすぎると :selected セレクターが非常に遅くなる jquery の継承がありますか? スクリプト全体でjqueryを使い続けたいのですが、jqueryで選択したオプションをすばやく見つけるための提案はありますか?

ありがとう、

クレイグ

4

2 に答える 2

10

選択ボックスの値を取得するときに :selected を呼び出す必要はありません。

デフォルトの動作は、selectedIndex を取得することです。

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

コメントに記載されているように、そのオプションのテキストにアクセスする必要がある場合は、使用できます

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

ただし、テキスト プロパティが必要であり、値とは異なることがわかっている場合は、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()

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;  
    // ...  
},

:selected セレクターを呼び出すと、すべての選択要素の子孫をループして、設定する .selected プロパティを探し、いずれかの配列を返します。いずれにせよ、これを行うとすべての子孫がループするので、これを行わないでください。

于 2009-02-12T15:45:25.837 に答える
0

あなたはこれを行うことができます:

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

var value = $( "#institutionCombo オプション:eq(" + ix +")" ).val();

しかし、それは事実上、古い学校のコードで行っていることです。

上記で行っていることは、jQuery コードが :selected セレクターに対して行っていることだと思っていたので、顕著な遅延があることに驚いています。

それ以外の場合、遅延の原因となっているのは構文エラーではないかと思います。おそらく実行する必要があります

$( "#institutionCombo オプション:選択済み" ).val();

(注: オプション: 選択済み vs : 選択済み)

于 2009-02-12T14:19:23.157 に答える