javascript - JavascriptまたはJQueryを使用してHTMLの入力テキストフィールドの一部を強調表示する方法

Question

HTML の自由に入力された入力テキスト フィールドに対して何らかの形式の検証を実行しています。JQuery または JavaScript を使用して、入力テキスト フィールド内の特定の単語またはフレーズ (特定の基準に基づく) を強調表示する方法はありますか?

Answer 1

テキスト入力ボックス内で、テキストの一部だけを強調表示する唯一の機会は、選択範囲を使用することです。selectionStartこれは、テキスト ボックスとselectionEndプロパティ、またはメソッドを使用して、最新のすべてのブラウザーで実行できますsetSelectionRange()(両方が存在する理由はわかりません)。

ライブデモ: http://jsfiddle.net/YNr7K/

コード：

var input = document.getElementById("textBoxId");
input.value = "Cup of tea";
input.setSelectionRange(0, 3); // Highlights "Cup"
input.focus();

古いバージョンの IE (< 9) では、面倒な のいずれかを使用する必要がありますTextRange。これを行う方法を示す関数については、この回答を参照してください。