ここでは、テキストボックスの背景色を退避して元に戻すサンプルコードを掲載しています。ここでは、beforeBackgroundColorプロパティという正にそのものなプロパティを使用しています。
スポンサーリンク
beforeBackgroundColorプロパティ
では、サンプルコードです。onfocusイベント(フォーカスがあたったときに発生)で背景色の退避と変更を行い、onblurイベント(フォーカスがはずれたときに発生)で退避した背景色をもとに戻しています。
<html> <head> <script language="JavaScript"> // onfocusイベント(フォーカスが当たったとき) function inputTextOnFocus(text) { // 現在の背景色を退避 text.beforeBackgroundColor = text.style.backgroundColor; // 背景色変更 text.style.backgroundColor = '#0000FF'; // ブルー } // onblurイベント(フォーカスが外れたとき) function inputTextOnBlur(text) { // 退避した背景色を元に戻す text.style.backgroundColor = text.beforeBackgroundColor; } </script> </head> <body> <input type="text" value="2018/08/21" onfocus="inputTextOnFocus(this);" onblur="inputTextOnBlur(this);"/> </body> </html>