ユーザーが指定したキーワードに基づいてテキストエリアをハイライト表示

Question

以下のスクリプトを使用して、テキストエリアで事前定義されたテキストを正しく表示できました。 http://www.strangeplanet.fr/work/jquery-highlighttextarea/

オンザフライで事前定義されたテキストをどのように変更することができますか？例えば。ユーザーは特定の入力ボックスに "green"と書かれ、次にテキストエリアで "green-words"が強調表示されますか？

Answer 1

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

Answer 2

たぶん、あなたはinput textがフォーカスを失ったときに、入力の変化（例えば/あなたは上の別の場所をクリックし、あなたがプラグインを呼び出すスニペットこのコードの

のようなもの

<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] 
    }); 
} 

を試みることができますページ）。もしあなたが好きなら、keyupイベントを使ってみてください。

Answer 3

入力ボックスのkeydownイベントにフックし、単語配列を変更してください。

私はあなたがにリンクされjQueryプラグインを使用したことがないが、このような何かが動作するはずです：

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

Answer 4

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