3

HTML ドロップダウンにデータベース データを入力しようとしています。そのために、データベースからデータを取得し、次のようにオプション要素を作成しています。

var obj = eval("(" + data + ")");
for (i = 1; i <= obj.DATA.length; i++) {
    var col_val = obj.DATA[i - 1];
    $("#dropdown").append('<option value="' + col_val + '">' + col_val + '</option>');
}

以下のように別の方法も試しました:

$("#dropdown").html(data);

ここで、data は、cfloop を使用してデータベース クエリをループした後、呼び出された CFC ページによって返されるオプション要素のリストを含む文字列です。

新しいオプションを追加する前に、以下のステートメントのいずれかを使用して古いオプションを削除しています。

$('#dropdown').empty(); 

$('#dropdown option').remove();

$('#dropdown').html('');

分析の結果、オプションを削除すると遅延が最大になることがわかりました。

オプションを削除するために使用できる、より高速な代替 JavaScript または Jquery 関数はありますか? または、パフォーマンスを改善するための回避策はありますか?

注: この目的には ColdFusion と AJAX を使用する必要があります。また、ColdFusion のビルトイン AJAX 機能も使用できません。

ありがとう!!

4

5 に答える 5

1

私は通常 ajax リクエストから html を返すので、レスポンスは次のようになります

<option value = "1">1</option>
<option value = "2">2</option>
<option value = "3">3</option>
<option value = "4">4</option>
...

次に$("#selectName").html(data);、一連のオプションタグを含む応答を選択に入力するために使用します。

于 2012-10-11T18:30:04.333 に答える
0

ループが繰り返されるたびにDOMにジャンプします。ループを終了した後、$( "#dropdown")操作を実行する必要があります。

于 2012-10-12T14:21:51.050 に答える
0

ColdFusion is undefined エラーは、/CFIDE/scripts フォルダーへの仮想マッピングが欠落している可能性があります。同様の CF インストールから webroot に手動でコピーして、これを回避するか、インストールを修正することができます。

于 2012-10-11T18:39:24.257 に答える
0
  1. ajax 経由でオプションを取得している場合は、firefox Firebug コンソールを実行して、データを取得するのにかかる正確な時間を確認できるはずです。これにより、問題がダウンロード時間とレンダリング時間のどちらであるかが確実に証明されます。また、考慮してください:クエリキャッシュ、js配列またはリストをjsファイルに書き込み、CFを介してストレートjs​​を使用するか、オプションの数を減らします(5kのオプションをスクロールすることはできません)

  2. データをリストとしてダウンロードして使用することもできます

    str.replace(',','<option>') 
    

オプションタグで各リスト項目を「ラップ」します。覚えておいてください: 値とテキストが同じである場合、value パラメーターを指定する必要はありません。AND: option タグを閉じる必要はありません:

    <option>1<option>2<option>3...<option>N
  1. 最後に、これでも遅すぎる場合は、レイジー ローダーを使用してオプションをより扱いやすいチャンクにロードすることをお勧めします。ユーザーのアクションに関係なく、遅延ローダーをトリガーしてチャンクをロードし続けることもできます (settimeout を使用)。

お役に立てれば。

于 2012-10-14T08:37:22.993 に答える