textareaやinput要素内の任意のテキストをハイライトするスクリプト・jQuery highlightTextarea

スポンサーリンク

textareaやinput要素内の任意のテキストをハイライトするjQueryプラグインのご紹介です。どこかで利用する機会があるかと思ったので備忘録。

フォームの入力項目でユーザーの入力したテキストに、設定したテキストがマッチしたらハイライトする、というもの。

jQuery highlightTextarea


東京と江戸をハイライト設定しています。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="jquery.highlighttextarea.min.js"></script>

本体とプラグインと用意されているCSSを読み込みます。

$('textarea').highlightTextarea({
  words: [{
    color: '#ADF0FF',
    words: ['foo', 'bar']
  }, {
    color: '#FFFF00',
    words: ['hogeoge']
  }]
});

色とキーワードを設定。

詳細は以下でどうぞ。ライセンスはMITです。

jQuery highlightTextarea

URL :
TRB :

Comments & Trackbacks (1)

Twitter

Web制作に役立つそうなリソースを独断と好みで配信しています。

かちびと.netにリンクの無いトラックバックはお受けいていません。
コメントされる前にガイドラインをご覧下さい。

twitter facebook rss contact

Leave a Reply

Ads

Posts

Contact

Services