フォームの内容で動作を切り換える

赤字:JavaScriptの命令や重要なタグ/青字:用途に応じて変更する部分/緑字:変更可能な変数名やユーザー関数名


戻る

実例

Yes No

例文

<form name="formChecker">
<input type="radio" name="rbtn" value="yes"> Yes
<input type="radio" name="rbtn" value="no" checked> No
<input type="button" value="送信" onClick="check()">
</form>

<script type="text/javascript">
function check() {
	var rcheck = document.formChecker.rbtn[0].checked; //ラジオボタンrbtnの1つ目(rbtn[0])の状態を取得
	//rcheckの内容がtrue(ボタンが押されている状態)かどうかで条件分岐
	if (rcheck) { //tureの場合
		document.location = "index.html"; //リンク先を呼び出す
	} else { //falseの場合
		alert("送信できません"); //アラートを表示する
	}
}
</script>

解説

送信ボタンを押したときに、チェック項目がYesかNoかによって処理を分岐させます。
上記例では Yes なら rchecktrue となりリンク先へ、No なら rcheckfalse となりアラートを表示します。処理内容は好きなように変更してください。
rbtn[0] が1つ目のボタンを意味しており、ここでは「Yes」を選択した場合に rchecktrue となりますが、rbtn[1] とすると「No」を選択した場合に rchecktrue となりますので、選択項目を変更したり増やしたりする場合には注意してください。
入力内容の最終確認や年齢認証によるリンク先の分岐にも使用できます。また、ラジオボタンを増やして選択に応じたページや画像を呼び出すメニューにも使えます。

戻る