ChosenとSelect2の違いは何ですか？

選ばれたとSelectセレクトは selectboxesを拡張するための2つの人気のライブラリです。

どちらも積極的にメンテナンスされているようで、Chosenは古く、jQueryとPrototypeの両方をサポートしています。

Select2はjQueryのみであり、そのドキュメントにはSelect2がChosenに触発されていると記載されていますが、行われた改善（ある場合）やその他の書き換えの理由については詳しく説明されていません。

2つのライブラリの機能セットはほとんど同じですが、私が見つけた唯一の比較は、やや決定的でないjsperfテストページです。

これらのライブラリのいずれかは、他のライブラリよりも優れていますか？

Select2 3.3.1以降、README.mdに記載されている内容は次のとおりです

選択されなかったSelect2サポートの機能

• 大規模なデータセットの操作：選択すると、データセット全体をoptionDOMにタグとしてロードする必要があるため、小さめのデータセットの操作に限定されます。Select2は、関数を使用してオンザフライで結果を検索するため、結果を部分的に読み込むことができます。
• 結果のページング：Select2は大規模なデータセットで機能し、一度に少量の一致する結果のみをロードするため、ページングをサポートする必要があります。Select2は、ユーザーが現在ロードされている結果セットの一番下までスクロールすると検索機能を呼び出し、結果の「無限スクロール」を可能にします。
• 結果のカスタムマークアップ：optionタグでサポートされている唯一のマークアップであるため、テキストの結果のレンダリングのみがサポートされます。Select2は、結果を表すためのあらゆる種類のマークアップを生成するために使用できる拡張ポイントを提供します。
• その場で結果を追加する機能：Select2は、ユーザーが入力した検索語から結果を追加する機能を提供し、タグ付けに使用できるようにします。

IMHO Chosenは「維持」されていますが、「アクティブに維持」されていません。Chosenの341の問題と51のプルリクエスト。Select2には128の問題と25のプルリクエストがあります。これらのパターンは基本的には

• 表面的にあなたにとってより魅力的なものを選ぶ
• 1つまたは2つのアプリで使用する
• カスタマイズの問題または制限に対抗する
• 問題やプルリクエストを介してコミュニティと協力してみてください
• 最終的にうんざりして、このプロセスで学んだことを使用して、自分でビルドしてください

どちらを選択しても、ユースケースがまさにそのスイートスポットにあれば、どちらでも機能します。そうでない場合は、最終的に独自に作成するか、これらを大幅にカスタマイズする必要があります。どちらの場合も、どちらを選択するかはそれほど重要ではありません。ここでは@Andy Rayと@paulの側にいると思いますが、Select2の方がおそらく最初の選択肢として適しています。

言及する価値のあるもう1つの違いChosenは、Sassand で開発されているのCoffeeScriptに対し、and Select2はプレーンCSSであるということJSです。これは私の個人的な選択肢であるSassとCoffeeScript難しいデバッグ作る複雑さの不要な層です。

両方を試した後、どちらも使用しないことにしました- 要素Select2に接続されているときは単純にそれを行うことができないため、アイテム作成機能を取得しようとすると非常に<select>厄介なことがわかります-私が持っているフープをよく考えていなかったジャンプする。

selectize.jsを使用<option>...</option>して、フォームのDOMに新しい要素を追加するだけで解決しました-それは正気です。それも使用しますLESSが、私はそれをバイパスして、コンパイルCSSされたプロジェクトを直接調整します。

chosen.jsとselect2.js

• 両方のMITライセンス
• 依存関係：
  • Select2：jQuery
  • 選択：tbc
• デスクトップブラウザーのサポート：
  • Select2：IE8 +
  • 選択：IE8 +
• デバイスのサポート：
  • 選択2：不明確
  • 選択済み：iPhone、iPod Touch、およびAndroidモバイルデバイスでは無効
• 重量（縮小）：
  • Select2：57KB
  • 選択：27KB
• 使用法：Select2は、より「ファンシー」なUIをサポートしています（「テンプレート」を参照）
• どちらのコードリポジトリもGithubで利用できます
  • Select2：貢献：非常に活発
  • 選択：貢献：Select2の約3分の1

ps。不足しているポイントの詳細が判明したら、この回答を更新してみます

まず、ChosenとSelect2は2つの優れたプラグインであり、これはChosenに関する私の個人的な体験です。彼らが言っていることはすべてChosenに関して真実です。

問題とPēterisCauneによって指さはselect2歳で、まだ公式の修正はありません。APIの優れたドキュメントはありません。それは何度も指摘されました（問題671を参照）が、まだ何もありません。この問題を解決するのに約2年かかりました。overflow:hidden表示する前にdivを非表示にした場合、選択したものは基本的に機能しません（そしてwitdh:X%、問題を探さないと基本的にわからないオプションを使用する必要があります）。

主な問題は、問題92でDelvarWorldが言ったように修正速度だと思います。

私のプルリクエストはこの問題を修正しますが、他のプルリクエストと同様に、選択されたものの多くは無視されます。このプロジェクトには、コードベースが小さすぎるコントリビューターが多すぎます。

私は最初にMITライセンスでChosenを選択しましたが、これらすべての問題（ドロップダウンカット、APIが見つからない、オーバーフローが非表示になっていないかを探す）があったため、select2に切り替えることにしました。そしてより速い修正。

Select2では機能するがChosenでは機能しない機能の1つselectは、overflow: hiddenまたはを持つ要素の内部overflow: autoです。

Chosenに対応する問題：https : //github.com/harvesthq/chosen/issues/86

これらの2つのプラグインで動作することがわかったいくつかの違い：

• select2を使用すると、オプションの任意の場所で検索できます。たとえば、ABCDEFGというオプションがあり、CDEと入力した場合、そのオプションは検索結果に表示されますが、選択した場合はABと入力する必要があります。

• より大きなデータセットでは、特にIEで、select2がselect2よりも高速であるように見えます。

Select2はモバイルをサポートしていますが、Chosenは特に iPod、iPhone、モバイルAndroidでそれ自体を無効にします。モバイルで「拡張」選択ボックスを使用する場合、これにより選択が簡単になります。

Select2での私の経験はデスクトップでは素晴らしいものでしたが、タッチモバイルデバイスでは非常に多様であり、いくつかの癖が常に存在していました。たとえば、xperia st15iでicsとストックブラウザーのドロップダウンは、キーボードを盗むフォーカスのために常に閉じていました。それを再び開く唯一の方法は、メニューを数十回タッチして、指を1秒ほど押したままにすることです。または、ドロップダウンリストが閉じているときに入力を開始し、何人のユーザーがこれを理解するのですか？

Selectize.jsはSelect2よりもはるかにスムーズに見えますが、たとえば、値が選択または入力されると、なんらかの理由でページが左端に移動するなど、モバイル上でも問題があります。また、オーバーフローをサポートしていない古いAndroid 2.xデバイスでは、キーボードがポップアップしないため、いくつかのトップオプションを超えて選択することはできません。:(

それでもChosenをテストする必要があり、モバイルデバイスで無効にすることはそれほど悪い考えではないかもしれませんが、結局のところ、古き良きドロップダウンはいつでもどこでも機能します。

更新：Chosenもテストしましたが、1つの領域ではより優れています。デフォルトではモバイルでは機能しません（素晴らしい！）が、単語のフィルタリングの問題があります。たとえば、は単語の途中で検索しません。また、アラインメントに＆nbspハックを使用すると、完全なオプションも無視されます。製図板に戻る。

Chosenよりselect2を選んだ理由

select2が持つ主要な機能は、他のコントロールが自動的に魔法のように持っていないことですが、コントロールの右側に「x」がある「すべてクリア」の選択です。これは私のアプリケーションのキラー機能です。他の選択タグ拡張ライブラリにこの機能がない理由はわかりません。

Select2はAJAX Chosenをサポートしていません

Select 2は、選択したものに比べてサイズが少し重いです。

ajax操作の公式サポートがないため、Select2に切り替えました。