html の input / select の背景色をfocus時に変更したいのです。1ページあたり30個ほど input / select があります。

ブラウザはIE6、変更時の背景色は1色です。
htmlには何も記述せずにjsファイルで制御したいのです。

以上、可能でしょうか?
可能でしたら方法を教えてください。

回答の条件
  • URL必須
  • 1人2回まで
  • 登録:2006/08/11 13:38:20
  • 終了:2006/08/11 15:23:53

回答(1件)

id:llusall No.1

llusall回答回数505ベストアンサー獲得回数612006/08/11 14:30:20

ポイント60pt

こちらでいかがでしょうか?

以下のjsファイルをhtmlファイルに追加してください。



■サンプルのHTMLファイル(sample.html)

<html>

<body>

<input type="text" value="" >

<br>

<input type="text" value="" >

<br>

<select>

<option value="1">1 

<option value="2">2 

<option value="3">3 

</select>

</body>

</html> 

<!-- 外部JavaScriptファイル                          -->

<SCRIPT LANGUAGE="JavaScript" src="hoge.js" ></SCRIPT>


■外部JavaScriptファイル(hoge.js)

function FocusColor(){

    if (event.srcElement.tagName == 'INPUT')   { // <INPUT>   のとき

        if (event.srcElement.type == 'text' || event.srcElement.type == 'password') {

            // type="text" か "password" だったら

            event.srcElement.style.background = 'pink';

            return;

        }

    }

    if (event.srcElement.tagName == 'SELECT')   { // <SELECT>   のとき

            event.srcElement.style.background = 'pink';

            return;

    }

}

function BlurColor(){

    if (event.srcElement.tagName == 'INPUT')   { // <INPUT>   のとき

        if (event.srcElement.type == 'text' || event.srcElement.type == 'password') {

            // type="text" か "password" だったら

            event.srcElement.style.background = 'white';

            return;

        }

    }

    if (event.srcElement.tagName == 'SELECT')   { // <SELECT>   のとき

            event.srcElement.style.background = 'white';

            return;

    }

}

// イベントの割り当て

var oElements;

oElements = document.getElementsByTagName("INPUT");

for (var i = 0; i < oElements.length; i++) {

    oElement = oElements[i];

    if (oElement.type == 'text' || oElement.type == 'password') {

        oElement.onfocus=FocusColor;

        oElement.onblur=BlurColor;

    }

}

oElements = document.getElementsByTagName("SELECT");

for (var i = 0; i < oElements.length; i++) {

    oElement = oElements[i];

    oElement.onfocus=FocusColor;

    oElement.onblur=BlurColor;

}

http://www.yahoo.co.jp ダミー

id:wm107p

OKでした。ありがとうございました。

2006/08/11 15:23:40

コメントはまだありません

この質問への反応(ブックマークコメント)

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

絞り込み :
はてなココの「ともだち」を表示します。
回答リクエストを送信したユーザーはいません