• ベストアンサー

onmouseoverのクラス指定

.hanten{ color:blue; background:orange; } 上記のクラスを作ったとして <onmouseover="hanten">反転</終了タグ> この指定では駄目なようです。onmouseoverに対しクラスを指定したい場合どうすればいいでしょうか? またもし宜しければenterキーを押したときテキストボックスのカーソルを移動することは可能かどうかわかる方いたらお願いします。

質問者が選んだベストアンサー

  • ベストアンサー
noname#84373
noname#84373
回答No.2

<html> <head><style> .focus{ background-color:#fee; } .blur { background-color:#eee; } .onms { border:1px red solid; } .offms{ border:1px #ccc solid; } </style></head> <body> <form id="abc"> <input type="text"><br> <textarea cols="20" rows="3"></textarea><br> <input type="text"><br> </form> <script> window.onload=function(){ autoForm('abc'); } function autoForm(n){ obj = document.getElementById(n).elements; for( var i=0; i<obj.length; i++){ if(i==0) obj[i].focus(); ty=obj[i].type obj[i].attachEvent("onkeydown", ret2tab ); if(ty=='text' || ty=='textarea') { obj[i].attachEvent("onfocus", function(){ o=event.srcElement;o.className=o.className.replace(/blur/,'focus');o.select()} ); obj[i].attachEvent("onblur" , function(){ o=event.srcElement;o.className=o.className.replace(/focus/,'blur'); } ); obj[i].attachEvent("onmouseover" , function(){ o=event.srcElement;o.className=o.className.replace(/offms/,'onms'); } ); obj[i].attachEvent("onmouseout" , function(){ o=event.srcElement;o.className=o.className.replace(/onms/,'offms'); } ); obj[i].className="blur offms"; } } } function ret2tab() {if(event.keyCode == 13) event.keyCode = 9;} </script> </body> </html> こんなふうなら、タグの中がごちゃごちゃしなくていいかも!? おっとこんな時間だ!じゃ

その他の回答 (1)

noname#84373
noname#84373
回答No.1

<html> <head><style> .hanten{ color:blue; background:orange; } .focus{ color:white; background:red;} </style></head> <body> <input type="text" id="a" onMouseover="this.className='hanten'" onMouseout="this.className=''" onFocus="this.className='focus'" onKeydown="ret2tab()"> <input type="text" id="b" onMouseover="this.className='hanten'" onMouseout="this.className=''" onFocus="this.className='focus'" onKeydown="ret2tab()"> <script> function ret2tab() {if(event.keyCode == 13) event.keyCode = 9;} </script> </body> </html> このままだと実用的ではないかと・・・

関連するQ&A