--
jQuery.ajax({
url:url,
data:parms,
success:function(response){
---
httpリクエストを投げて、HTMLデータ(<option>~</option>が10~1万行ほど)を
受け取り、それを
jQuery('#displist').html(response) で描画しています。
(select内のoptionになります)
<option>~</option>の数が少ない時は問題ないのですが、1000を超えたあたりから
目に見えて重く、表示に時間がかかり、困っています。
サクッと表示させる方法はないものでしょうか…?
No.3ベストアンサー
- 回答日時:
jQueryを使わずにJavaScript(DOM)ネイティブのinnerHTMLを使えば最速です。
フォームフィールドのinnerHTMLはブラウザ依存がでる可能性があるので、
<select>のinnerHTMLではなく、<select>の親要素のinnerHTMLに、"<select 略><option>~</select>"として入れる方がいいと思います。
イベントハンドラを登録された要素を削除するとメモリリークになる可能性があるので注意してください。
イベントハンドラを削除してからinnerHTMLに代入すると問題ありません。
No.2
- 回答日時:
> 別途csvの画面などは用意する予定です。
なるほど、ならばそのCSV画面用に送られるCSVデータを使ってoptionタグを作ってやればいいのかもしれません。
あとはお客様に選択肢1万件のselectを試させて「やっぱりこれは使いづらいな」と思わせ、インターフェースの変更を認めていただくところですが、……
> ごもっともなのですが、この作りなので仕方ないのですよね…。
で言っている「仕方ない」理由を説明していただければもう少し適切な回答がつくと思います。
No.1
- 回答日時:
おそらくデータ通信が一番のボトルネックでしょうから、HTMLタグ込みで送受信するのではなくoptionタグを生成できるだけのデータを送受信してブラウザ側でそのデータからoptionタグを作ってやるのが……
……って、選択肢が(最大)1万ですか!?
想像してみてください、1万個の選択肢を見ながら選択するデータを見つけなくてはならないとしたら、あなたはどう思いますか?
検索で候補を絞り込ませるなりデータのカテゴリ分けを施すなりして選択肢を減らすほうがいいのではないかと思います。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript セレクトボックスで配列を呼び出したい。 1 2022/07/08 20:14
- JavaScript セレクトボックスを2つ選択してメッセージなどを表示するには。~運賃検索プログラムを完成させたい~ 1 2022/07/22 11:10
- JavaScript console.logがどうしても2つ機能しないのでアドバイスをくださいお願いします 2 2022/07/07 22:13
- JavaScript 以前の質問だと、どの条件でも配列が表示されてしまいます。 1 2022/07/09 11:40
- JavaScript 電車の運賃を出すプログラムを作っています。 2 2022/06/22 09:36
- JavaScript 1度きりではなく、繰り返し、挙動が変わるようにしていただきたいです。 1 2022/07/03 15:50
- JavaScript jQueryでのドラッグアンドドロップについて 1 2022/07/07 21:04
- JavaScript セレクトボックスを2つ設けて選択して初めてメッセを表示 1 2022/07/27 12:15
- JavaScript switch文のswitch(n)の部分を複数の値にするか、if文に変えてほしいです。 1 2022/07/27 17:18
- JavaScript セレクトを全て選択されていないと、文字によるエラーメッセージを表示させるコードを調べています 2 2023/06/22 15:48
このQ&Aを見た人はこんなQ&Aも見ています
関連するカテゴリからQ&Aを探す
おすすめ情報
このQ&Aを見た人がよく見るQ&A
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
【Ajax】改行を含めたデータを...
-
Ajax、PHP、MySQLでDBからデー...
-
リンクを押すとEXEファイルを実...
-
ASP.NET(VB)VBソースからJavas...
-
インターネット上のファイルサ...
-
ハローワークインターネットサ...
-
8ビットダウンカウンタをVerilo...
-
JSTLを利用してJavascriptの結...
-
JQuery サーバー上にアップする...
-
PHPで一定時間が経過すると処理...
-
作成したHTMLフォーム画面の記...
-
PHP内でJavaScriptの処理は可能?
-
DirectXとOpenGLはどちらが動作...
-
PC自動操作ソフト
-
C言語のif文について教えてくだ...
-
非同期式3進カウンタ
-
外部プログラム実行時の戻り値
-
読み取り専用が外れない
-
掲示板の荒らし対策
-
ローカルでのhtmlチェックにつ...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
カーソルの動きに合わせてDBか...
-
Ajaxでpostした内容のresponse...
-
チャットを作る
-
HTMLでリアルタイムグラフを作...
-
大量のデータを表として展開す...
-
データ受け渡しについて
-
ajaxでhtmlを返して画面に描画…...
-
Response.Write(変数)
-
Ajaxで最新の情報が取得できない
-
jQueryの$.postの戻り値による...
-
ローカルネットワーク内での502...
-
【Ajax】改行を含めたデータを...
-
Ajax、PHP、MySQLでDBからデー...
-
セレクトボックスのHTMLを教え...
-
【JavaScript】confirmのボタン...
-
DirectXとOpenGLはどちらが動作...
-
非同期通信を使うタイミングが...
-
HTMLでDBからデータを表形式で...
-
リンクを押すとEXEファイルを実...
-
saved from url=(0013)abou
おすすめ情報