人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

[JavaScript]
フォームコントロールにフォーカスを受けた時に、背景色を変えるなどの処理を加える場合、
<input type=”text” onfocus=”this.background=”#EFF” onblur=”this.background=”#FFF” />
などとすると思いますが、フォームコントロールがページ内に大量にある場合の記述が面倒です。

一括で行う方法をよろしくお願い致します。

●質問者: akame23
●カテゴリ:ウェブ制作
✍キーワード:JavaScript コントロール フォーカス 背景色 記述
○ 状態 :終了
└ 回答数 : 3/3件

▽最新の回答へ

1 ● kawai0000
●10ポイント

http://www.vector.co.jp/soft/win95/util/se072729.html

TextSS(Windows95/98/Me / ユーティリティ)

私の場合、該当するページや箇所を、置換ソフトを使って全て書き換えています。

これなら、そのページに限らず、全てのページに適用できますがいかがでしょうか?

◎質問者からの返答

ご回答ありがとうございます。

ページ内にあるフォームコントロール全てに質問内容の処理を加えるスクリプト(JS)を求めます。

ひとつひとつにonfocus,onblurを記述するのが面倒(メンテナンス性が悪い)なのです。よろしくお願い致します。


2 ● english
●50ポイント

</body><html>の後ろに、

---------------------ここから-----------------

<script>

function chBa(){

this.style.backgroundColor=”#EFF”;

}


function chCa(){

this.style.backgroundColor=”#FFF”;

}

n=document.forms[0].elements.length;

for(i=0;i<n;i++){

document.forms[0].elements[i].onfocus = chBa;

document.forms[0].elements[i].onblur = chCa;

}

</script>

</body>

</html>

--------------------ここ------------------

のようにすれば、良いかと思います。formの数が1個の場合です。普通は1個だと思います。


IE6とFirefox1.0.4、Netscape7.1、Opera7.54u2(以上、WindowsXP)、Safari2.0、MacIE5.2.3で確認しました。

◎質問者からの返答

ご回答ありがとうございます。

ご提示頂きましたスクリプトをファンクションにまとめ、onload で呼び出す事で実現出来ました!

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


3 ● typista
●10ポイント

以下のようなロジックで可能です。

※戻し(onBlur)はご自分で作成してください。


<html>

<script language=”JavaScript”>

function changeBackground() {

for( i = 0; i < document.forms[”hoge”].length; i++ ) {

document.forms[”hoge”][i].style.backgroundColor = ”#ff0000”;

}

}

</script>

<body>

<form name=”hoge”>

<input type=”text” name=”test1” width=”50” onFocus=”changeBackground()” />

<input type=”text” name=”test2” width=”50” onFocus=”changeBackground()” />

<input type=”text” name=”test3” width=”50” onFocus=”changeBackground()” />

</form>

</body>

</html>

◎質問者からの返答

ご回答ありがとうございました!

これにて終了させて頂きます。

関連質問


●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ