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

関連記事

  1. LuminJS

    JavaScript

    テキストを徐々にハイライトしていく「LuminJS」

    LuminJSはWebページ上のテキストを徐々にハイライトしていくJa…

  2. js-offcanvas

    JavaScript

    上下左右にオフキャンバスのナビゲーションを実装できる「js-offcanvas」

    js-offcanvasは、上下左右にオフキャンバスのナビゲーションを…

  3. no-image

    JavaScript

    多彩なパラメーターでモバイルフレンドリーなjQuery Lightboxプラグイン「frydBox」…

    frydBoxは、多彩なパラメーターでカスタマイズ性の高いモバイルフレ…

  4. dndod

    JavaScript

    依存性のないシンプルで簡単なモーダルライブラリ「dndod」

    dndodはjQueryなどへの依存性のないシンプルで簡単なJavaS…

  5. Random Quote Machine

    JavaScript

    ランダムにテキスト(クオート)を表示させる「Random Quote Machine」

    Random Quote Machineは、設定したデータのなかからラ…

  6. no-image

    JavaScript

    マテリアルデザインによるjQueryタイムピッカー実装「MDTimePicker」

    MDTimePickerはマテリアルデザインをコンセプトにしたタイムピ…

最近の記事

  1. Hermèsオレンジスポーツバンド
  2. GoPro HERO8 Black
  3. 16インチMacBook Pro

アーカイブ

PAGE TOP