- ベストアンサー
ラジオボタンのフォーカス移動方法について
- ラジオボタンのグループ別に並んでいる場合、Enterキーを押したときに次のラジオボタングループのチェックが入ったラジオボタンにフォーカスを移動する方法を探しています。
- ラジオボタンのフォーカスを移動する方法について悩んでいます。ラジオボタンがグループ別に並んでおり、Enterキーを押したときに次のグループのチェックが入ったラジオボタンにフォーカスを移動させたいです。
- ラジオボタンのグループごとに次のラジオボタンにフォーカスを移動したいです。ラジオボタンのグループが複数ある場合でも、Enterキーを押したときに次のグループのラジオボタンにフォーカスが移るようにしたいです。
- pentaro_2000
- お礼率66% (6/9)
- JavaScript
- 回答数1
- ありがとう数2
- みんなの回答 （1）
- 専門家の回答
質問者が選んだベストアンサー
pentaro_2000さんの質問を見て、初めて知りましたけど、HTMLの機能では、ENTERキーを押下されても、フォーカスが次の場所へ移動することは無いんですね 少し調べて見ましたが、HTMLだけではENTERキーによるフォーカス移動は出来ないみたいなので、JavaScriptにてラジオボタンのみフォーカスの移動が出来るモジュールを組んで見ました。 一つの例として、以下のソースを書いておきますが、「良いソースコード」とは、決して言えません。 サッと作った物なので、IEのみの対応となっています＾＾； 説明： focusChange関数の引数で、現在フォーカスを保持しているオブジェクトを渡し、関数内処理で、そのオブジェクト以降に存在するオブジェクトの中でチェックが付いているオブジェクトを検索し、そのオブジェクトにフォーカスが移る作りになっています。 <HTML> <HEAD> <SCRIPT LANGUAGE="JavaScript"> <!-- // 注) IEのみ対応 // 指定したオブジェクトのIDを取得する function getElementID( obj ) { var k; for( k = 0; k < document.all.length; k++ ) { // オブジェクト比較し、検索を掛ける if( document.all(k) == obj ) return k; } return -1; } function focusChange( obj ) { var id; var k; // keyCode:13＝ENTERキー押下時 if( event.keyCode == 13 ) { id = getElementID(obj); for( k = id + 1; k < document.all.length; k++ ) { // ID番目以降でチェックが付いているオブジェクトを検索 if( document.all(k).checked ) { document.all(k).focus(); break; } } } } //--> </SCRIPT> </HEAD> <BODY> <LABEL FOR="a"><INPUT type="radio" id="a" name="a" value="0" onKeyPress="focusChange(this);" checked>すべて</LABEL><BR> <LABEL FOR="b"><INPUT type="radio" id="b" name="a" value="1" onKeyPress="focusChange(this);">一部</LABEL><BR> <LABEL FOR="c"><INPUT type="radio" id="c" name="a" value="2" onKeyPress="focusChange(this);">なし</LABEL><BR> <LABEL FOR="d"><INPUT type="radio" id="d" name="b" value="0" onKeyPress="focusChange(this);" checked>すべて</LABEL><BR> <LABEL FOR="e"><INPUT type="radio" id="e" name="b" value="1" onKeyPress="focusChange(this);">一部</LABEL><BR> <LABEL FOR="f"><INPUT type="radio" id="f" name="b" value="2" onKeyPress="focusChange(this);">なし</LABEL><BR> </BODY> </HTML>
お礼
うまくできました。 オブジェクトも比較できるんですね。 勉強になりました。ありがとうございました。