javascript - ユーザー指定のキーワードに基づいてテキストエリアを強調表示する

Question

以下のスクリプトを使用して、テキストエリアで事前定義されたテキストを強調表示することに成功しました。 http://www.strangeplanet.fr/work/jquery-highlighttextarea/

事前定義されたテキストをその場で変更するにはどうすればよいですか？たとえば、ユーザーが特定の入力ボックスに「緑」と入力すると、テキストエリアで「緑の単語」が強調表示されますか？

Answer 1

多分あなたは次のようなことを試すことができます

<input type="text" id="wordtohighlight">
<textarea>lorem ipsum green sit dolor amet green</textarea>

Js / jQuery

$('#wordtohighlight').on('change', function() {
    var v = $(this).val();
    $("textarea").highlightTextarea({
         words: [v]
    });
}

このコードスニペットを使用すると、入力が変更されたとき（たとえば、input textフォーカスを失ったとき/ページの他の場所をクリックしたとき）にプラグインを呼び出します。必要に応じて、keyupイベントを使用してみてください

Answer 2

$("#input-id").keydown (function () {
    var word = $(this).val();
    if (word) {
        word += '-words';
        $("textarea").highlightTextarea({
            words: [word]
        });
    }
});

Answer 3

入力ボックスのkeydownイベントに接続し、単語の配列を変更します。

リンクしたjQueryプラグインを使用したことはありませんが、次のようなものが機能するはずです。

$("#target").keydown (function () {
    $("textarea").highlightTextarea({
          words: [$(this).val()]
    });
});

Answer 4

$("#input-id").bind('keypress',function () {
    var word = $(this).val();
    if (word) {
        $("textarea").highlightTextarea({
            words: [word]
        });
    }
});