<form id="target">
<input name="hoge" type="radio" value="a"> A
<input name="hoge" type="radio" value="b"> B
<input name="hoge" type="radio" value="c"> C
</form>
// form要素を取得
var element = document.getElementById( "target" ) ;
// form要素内のラジオボタングループ(name="hoge")を取得
var radioNodeList = element.hoge ;
// 選択状態の値(value)を取得 (Bが選択状態なら"b"が返る)
var a = radioNodeList.value ;
if ( a === "" ) {
// 未選択状態
} else {
// aには選択状態の値が代入されている
console.log( a ) ;
}
(こちらのサイトのコードをお借りした)しかし、ラジオボタンが一つしかないとき、この方法は使えない。クリックされていない状態でも value が返ってくる(複数あって一つも選択されていないときは value が "" となる)。
ラジオボタンの数が可変で一つのこともある場合は、一つの場合だけ処理を分け、value ではなく、checked (選択されていると true) で拾うのが吉。
上記ソースだと、ラジオボタンが一個の場合は
// 選択状態の値(true)を取得
// value は最初から input 要素の value 属性が設定されている
var a = radioNodeList.checked ;
if ( a === false ) {
// 未選択状態
} else {
// 選択状態
}
0 件のコメント:
コメントを投稿