HTML ドロップダウン コントロールにオプション (値) の最大数はありますか?
-
09-06-2019 - |
質問
ドロップダウンリストにどれだけのオプションを含めることができるか知っている人はいますか?無制限ですか?パフォーマンスが低下するまでに何回?
解決
ドロップダウンリストにどれだけのオプションを含めることができるか知っている人はいますか?無制限ですか?
理論上は無制限ですが、コンピューターの RAM や特定のブラウザーの制限が影響するため、実際には明らかにそうではありません。
パフォーマンスが低下するまでに何回?
繰り返しになりますが、これはいくつかの要因、少なくとも特定のブラウザ、コンピュータのメモリ、および処理能力に依存します。
編集:経験上、私は何千ものオプションを含むドロップダウン リストを使用したことがあります。しかし、これは理想的ではありませんでした。誰がそれらすべてをスクロールしたいと思うでしょうか?これが、さまざまな理由、特にエンド ユーザーのエクスペリエンスから、ある種のオートコンプリートの方が望ましい理由です。
他のヒント
アップデート:DannyG に基づいて、4GB メモリ PC 上の Firefox を備えた Ubuntu でテストしたところ、制限は 10,000 タグをはるかに超えていました。私の現在のFirefoxは最大3GBを使用するように設定されており、オプションは10万に達していますが、そのためにはブラウザのデフォルト設定を変更する必要があると思います。
30 以上のオプションが指定されているすべてのケースで、代替として Ajax オートコンプリートを使用することを選択しました。
Firefox と Chrome はどちらも、デフォルト設定で 4GB RAM を搭載した Windows 64b ではオプションが 10,000 に制限されています。
JSFiddle でテスト済みhttp://jsfiddle.net/Mare6/
HTML:
<a>Testing Select</a>
<select id="list"></select>
JavaScript
window.onLoad = function() {
for (var i=0; i<10000; i++) {
var name = "Option "+i;
var sel = document.getElementById("list");
sel.options[sel.options.length] = new Option(name,i);
}
});
よろしく、
私はリストで約 500 を使用しましたが、目立ったパフォーマンスへの影響はありませんでした。それが役に立てば幸いです。
私の経験では、パフォーマンスの低下は一般にユーザー側にあり、私の黄金律 (どこかで学んだ) は 7 つのオプションで、いくつかを与えるか取るかです。
SW に関連したベースでは、おそらく Integer の上位範囲です。
編集:ところで、これはある種の関連性があります アトウッド
はい、Chrome と Safari の最大アイテム数は 10,000 です。 select
少なくとも要素。
Chrome ソース内の関連する行は次の場所にあります。定義された最大値は 10000, 制限を強制し、コンソールにエラーを表示するコード
私のテストによると、Firefox には実質的な制限はないようです。
理論上、制限はありませんが、一部のブラウザーでは制限が実装されます。(使い方と同様 document.write
無限ループになってしまいます。)
しかし、結局のところ、私がドロップダウン リストで推奨する最大値は約 50 です。なぜなら、そこまで多くのスクロールをしたい人はいないからです。ただし、アルファベット順などに整理すると、ドロップダウン リストに 200 個もの項目を含めることが適切になる場合があります。(出生国を選択する必要がある登録フォームの場合と同様です。)
また、さまざまなセットの選択肢が多数ある場合、通常は、いずれにしてもドロップダウン リストが最適なオプションです。