2

ドロップダウンメニューを再作成しようとしています。myList を取得するために ajax 呼び出しを行っています。新しいリストを作成したら、select 要素からすべてのオプションを削除し、新しい値 (約 100 個のオプション) を挿入します。これは、IE および Firefox の新しいバージョンでうまく機能します。リフレッシュはほぼ瞬時に行われます。ただし、IE6 では、これらの操作によってブラウザの速度が大幅に低下します。オプションがドロップダウン ボックスから削除されると、ドロップダウン ボックスはほぼアニメーションになり、これが数秒間続きます。古いリストを新しいリストと比較し、変更された項目のみを削除/追加する以外に、これを高速化する方法はありますか?

$("#myselect").children.remove();

$.each(myList, function(i, val) {
   $("<option>").attr("value", val.myID)
                .text(val.myText)
                .appendTo("#myselect");
});
4

2 に答える 2

2

あなたのコードははるかに優れていますが、遅すぎる場合は、直接ルートを選択してください（jQueryを使用する前に過去に行ったことがあり、IE6を含むすべてのブラウザで即座に実行できました）。html を削除して、select からすべての子を削除するだけです。

$("#myselect").html('');

そして、各オプションのhtmlを作成するようにループを変更し、それを使用して選択に挿入します

$('#myselect').html(optionsHTML);

パフォーマンスに応じて、このソリューションと karim79 のソリューションの中間点を試すことができます (つまり、html() でオプションを削除し、プレーンな HTML を作成する代わりに配列を使用してそれらを追加します)。

于 2009-11-30T17:42:56.947 に答える
2

新しい要素を作成し、それを切り替えるとどうなりますか?

var newSelect = $("<select></select>");
$.each(myList, function(i, val) {
    $("<option>").attr("value", val.myID)
                 .text(val.myText)
                 .appendTo(newSelect);
});
$("#myselect").replaceWith(newSelect);
于 2009-11-30T17:25:45.593 に答える