スポンサーリンク

JavaScriptの動かないコード (中級編) nullが0以上0以下と認識されてしまう


以下のJavaScriptコードが意図した動作をしないのは,なぜですか。(制限時間1分)


やりたい事:

  • ラジオボタンの中で,どれかボタンが選択されたかを検証する。
  • 何も選択されていない場合,警告のメッセージを表示。
<body>

どれか選択して下さい。<br>

<input type="radio" name="hoge" value="0"> 0 <br>
<input type="radio" name="hoge" value="1"> 1 <br>
<input type="radio" name="hoge" value="2"> 2 <br>
<input type="radio" name="hoge" value="3"> 3 <br>


<input type="button" value="値を検証" onclick="validate_value()">


<script language="JavaScript">

// ラジオが選択されたかどうかを検証する
function validate_value(){

	// 値を取得する
	var val = get_radio_value();
	
	// 有効な値か?
	if( val >= 0 )
	{
		// OKの場合
		alert( "有効な値が選択されています。(値=" + val + ")" );
	}
	else
	{
		// NGの場合
		alert( "ラジオが未選択です。値を選択してください。" );
	}

}


// ラジオボタンで選択されている数値を返します。
// もし,何も選択されていない場合,nullを返します。
function get_radio_value()
{
	var val = null;

	// name属性によってradioの要素を全部取得
	var radio_elems = document.getElementsByName("hoge");
	
	// チェックされている物の値を保存
	for( var i = 0; i < radio_elems.length; i ++ )
	{
		if( radio_elems[ i ].checked )
		{
			// 数値に変換しておく
			val = parseInt( radio_elems[ i ].value, 10 );
		}
	}
	
	return val;
}


</script>


</body>
続きを読む