アウトライン

入力中のテキストボックスの背景色を変える

投稿日:

HTMLで入力中の背景色を変える

よくあるパターンで入力中のエリアをわかりやすく
するためにフォーカスのあるテキストボックスの
背景色を変えてみます。

背景色を変えるには「style」の「backgroundColor」を操作する

背景色を変えるにはその部品の「style」にある
「backgroundColor」をJavascriptで書き変えます。

実際に変更する際の処理は

のように「backgroundColor」に変更したい色を
設定します。

色を元に戻すためにもう一つ関数を用意します。

入力テキストボックスでフォーカスの有無を取得

入力テキストボックス側では「onFocusイベント」と
「onBlurイベント」を使って背景色を操作します。

実際にHTMLを作成して実行

実際にHTMLを作成して入力中のテキストボックスの
背景色を変更します。

もっとシンプルにすると

editColor()関数とdefaultColor()にして

にして呼び出す側で

とするのも良いでしょう。




-アウトライン
-, ,

Copyright© ソフトウェア開発日記 , 2017 AllRights Reserved.