Tag-it

JavaScript

サジェスト機能を搭載したタグ編集ウィジェット「Tag-it」

Tag-itはサジェスト機能を搭載したjQuery UIプラグインによるタグ編集ウィジェットです。シンプルな設定で使用できるほか、数多くのオプション項目が用意されているのでカスタマイズしたい場合にも最適です。

Tag-it

デモ

Demoというところにタグを入力するボックスが設置されていて、ここに好きなキーワードを入力してタグを登録することが可能です。サジェスト機能が搭載されているので、例えばaという文字を入力すると、その下に「asp」と「apl」というタグの候補が表示されます。

入力を補助してくれるサジェスト機能は、ユーザーにとっては便利な機能ですね。

また、オプションもかなり豊富でさまざまなカスタマイズを施すことができます。主なオプションは、fieldName、availableTags、autocomplete、showAutocompleteOnFocus、removeConfirmation、caseSensitive、allowDuplicates、allowSpaces、readOnly、tagLimit、singleField、singleFieldDelimiter、singleFieldNode、tabIndex、placeholderTextです。

その他、オプション以外にもイベントやメソッドも用意されています。というわけで、シンプルな設定ながらも豊富なオプションやイベントで高いカスタマイズ性も備えた高機能なタグ編集ウィジェット「Tag-it」の紹介でした。

Tag-it

no-image背景にSVGによるライン(線)をランダムで生成する「ckLine.js」前のページ

CSSによる素敵なスピナーコレクション「Epic Spinners」次のページEpic Spinners

関連記事

  1. AJAX Live Search
  2. Pongstagr.am

    JavaScript

    自分のインスタグラムの画像を表示できるjQueryプラグイン「Pongstagr.am」

    Pongstagr.amは自分のインスタグラムの画像をWebサイトに表…

  3. ContentTools

    JavaScript

    画面内でそのまま編集できるWYSIWYGエディタ「ContentTools」

    ContentToolsは画面内でそのままコンテンツを編集できるWYS…

  4. bootstrap-wysihtml5

    JavaScript

    シンプルで美しいWYSIWYGエディタを実装できる「bootstrap-wysihtml5」

    bootstrap-wysihtml5はシンプルでスッキリしたデザイン…

  5. Modaal

    JavaScript

    アクセシビリティに優れたモーダルウィンドウを実装できる「Modaal」

    ModaalはWCAG 2.0のレベルAAをサポートしているアクセシビ…

  6. JavaScript

    スライドアニメーションが素敵なjQueryスライダー「Slideshow with jmpress.…

    とても素敵なスライドアニメーションを実装することができるjQueryス…

最近の記事

  1. 10種の野菜と5種のビーンズ サラダラップとドリップコーヒー
  2. EOS RP
  3. COMOLI シルクネルジャケット シルクネルドローストリングパンツ
  4. スターバックス ハシエンダ アルサシア

アーカイブ

PAGE TOP