StackOverflowの入力タグのようなjQueryオートコンプリートタグ付けプラグイン?[閉まっている]


523

SOがタグの入力に使用するのと同じオートコンプリートを実現するソリューションは何ですか?

1つの単語を処理できるプラグインはありますが、複数の単語を処理するプラグインは見たことがありません。


ツールRecとして閉じる投票。
Ciro Santilli郝海东冠状病六四事件法轮功

1
最高のものを作成しました-github.com/yairEO/tagify
vsync

@vsync最初の回答のリストに追加しました。残念ながら、回答にコードがないため、codepen.ioに直接リンクできません
Joe Phillips

@JoePhilllips-Googleの短縮URLを受け入れる可能性があります
vsync

@JoePhilllips-私のプラグインは、リストの一番上にある最高のものよりも優れており、一番上に値するに値し、そのための良いセールスポイントがあります。現在、リストの一番上のものは肥大化しており(私のものよりもx4)、追加の入力要素(フォームのシリアル化には不適切)を使用し、コンマやタグの貼り付けをサポートしていません。それは素晴らしいですが、ほとんどの場合不必要ないくつかの機能を提供します。autocomplete必死に私見を使用する必要があります
VSYNC

回答:


763

IE9では「行:18エラー:オブジェクトはプロパティまたはメソッド 'tagit'をサポートしていません」
Raghav

2
最新のバージョン、ドキュメント、この驚くべきプラグインのより広範な例を探している人は、ここにアクセスしてフォークしてください:github.com/aehlke/tag-it
Crisman

1
更新:magicsuggestが今のところ最良の選択肢だと思います。
ssj

8
tag-itは過大評価されています。単純なタグシステムにjqueryを必要とすることは多すぎますが、jQuery UIとjquery UI CSSも同様に必要とすることは、今日、狂っています。それだけの価値はありません。
Alvaro

1
@scniro私が使用して終了jquery.tagsinputを私はすでに私のプロジェクトで使用されているjQueryのを使用して気にしないので。jqueryのUIとCSSを要求するのはおかしいのですが。
アルバロ

62

ブートストラップ:ブートストラップを使用している場合。これは本当に良いものです:Select2

また、TokenInputは興味深いものです。1つ目はjQuery-UIに依存せず、2つ目は構成が非常にスムーズです。

私が持っていた唯一の問題は、ネイティブの無料タグ付けをサポートしていません。そのため、クエリ文字列を応答JSONの一部としてクライアントに返す必要があります。


@culithayがコメントで述べたように、TokenInputはカスタマイズする多くの機能をサポートしています。そして、他の人が持っていないいくつかの機能のハイライト:

  • tokenLimit:ユーザーが選択できる結果の最大数。無制限の選択を許可するにはnullを使用します
  • minChars:検索を実行する前にユーザーが入力する必要のある最小文字数。
  • queryParam:サーバー側で検索語が含まれると予想されるクエリパラメータの名前

入力のためのculithayに感謝します。


3
TokenInputは、私が探していたものとまったく同じように見えます。ユーザーが何かを入力し、サーバーで検索を実行します。ユーザーは、検索された要素を選択し、すすぎ、繰り返すことができます。
Mala

1
TokenInputは、カスタマイズする多くの機能をサポートしています。そして、他の人が持っていないいくつかの機能を強調します。-tokenLimit:ユーザーが選択できる結果の最大数。無制限の選択を許可するにはnullを使用します-minChars:検索を実行する前にユーザーが入力する必要のある最小文字数。- queryParam:あなたは、サーバー側での検索語が含まれていることを期待し、クエリのparamの名前
culithay

1
@culithayが回答に追加されました
Nishant

新しい無料のタグを追加する方法:stackoverflow.com/questions/28656977/…ハード:-(
Ciro Santilli郝海东冠状病六四事件法轮機能

いいね。無料のタグ付けをサポートしないことは、簡単に克服できるため、大きな問題ではありません。
RationalRabbit

9

これは、jQueryをダウンロードすることと、CDNを介してアクセスすること(現在は存在しない)についての補足的な質問に最初に回答したものです...

グーグルについての事に答えること。私は自分のサイトの対応するCDNを介してJQueryおよびこれらの種類のライブラリのほとんどにアクセスすることに移動しました。

より多くの人がこれを行うと、ユーザーのマシンにキャッシュされる可能性が高くなるため、私の投票は良い考えです。

私が最初にこれを提供してから5年間で、それは一般的な知恵になりました。


3
これもデフォルトテンプレートの一部としてロールアウトします。Googleはこのコードを圧縮してCDNから提供することができます。さらに、訪問者がこれをキャッシュしている可能性が2%ある場合でも、まったくないよりはましです。
トム

27
これは元の質問に対する答えですか?
デレク

3
最後の「また、...」では、Googleバージョンへのリンクが良いアイデアか悪いアイデアかを尋ねます。私の答えは、ますます良いアイデアになるということです。
ジュリアン

@Derek最初に質問したとき、他に受け入れられる答えはなかったと思います。それはその後変更されました。
Joe Phillips



1

このjqueryプラグインGithubをオープンソース化しただけです:tactivos / jquery-sew


1
このリンクで質問に答えることができますが、回答の重要な部分をここに含め、参照用のリンクを提供することをお勧めします。リンクされたページが変更された場合、リンクのみの回答は無効(および反対票)になる可能性があります。それが重要である理由については、回答方法を参照してください。
バイトバスター

3
デモページは死んでいます。
Edward Olamisan 14
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.