radioボタン選択後、if文で選択に応じた結果をhtmlで返す

###前提・実現したいこと


「戦う」を押したら「勝ち」
「逃げる」を押したら
「負け」とでるようにしたい。

###発生している問題・エラーメッセージ

「戦う」「逃げる」いずれを押しても
「負ける」と表示されてしまう。

if括弧の中でformの内容を
正しく比較できてないと思われ、

その方法が調べてもわからない。

###html javascript

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<title>Sample3</title>
<script type="text/javascript">


function Sample3(){
  if ( document.Sample3_form.tatakau.value == "戦う") {
     document.write("勝ち");
  }else{
  document.write("負け");
}
}

</script>
</head>


<body>
<form name="Sample3_form" action="idomu_sample.html">
<input id="tatakau" name="tatakau" type="radio" />戦う<br>
<input id="nigeru" name="tatakau"  type="radio" />逃げる<br>
<input type="button" value="決断する" onclick="Sample3()">
</form>
</body>
</html>

###試したこと


ifの中で、ひたすらformのidやらを比較しようと頑張りました。

行動規範の内容に同意します

回答3件

前々回の質問と同じ回答ですが、御覧になられていないようなので。

<!DOCTYPE html><html lang="ja"><head><meta charset="utf-8">
<title>Sample3</title>
<script>
function Sample3() {
	console.log( document.Sample3_form.tatakau.value );
	if ( document.Sample3_form.tatakau.value === '戦う' ) {
		document.getElementById("result").innerHTML = '勝ち';
	} else {
		document.getElementById("result").innerHTML = '負け';
	}
}
</script>
</head><body>
<form name="Sample3_form" action="idomu_sample.html">
<input type="radio" name="tatakau" value="戦う" />戦う<br>
<input type="radio"  name="tatakau" value="逃げる" />逃げる<br>
<input type="button" value="決断する" onclick="Sample3()"> 
</form>
<div id="result"></div>
</body></html>

投稿2016/05/19 02:03

kei344

総合スコア69407

keys

2016/05/19 03:31

前回の回答も参考にさせていただいたのですが、技量不足で理解を進めていけなかったので改めて思考を練りながら質問させていただきました。おかげさまで解決いたしまいた。ありがとうございました。

行動規範の内容に同意します

そもそも取得しようとしているradioの値が設定されていないので

html
1<input id="tatakau" name="tatakau" type="radio" value="戦う" />戦う<br>
2<input id="nigeru" name="tatakau"  type="radio" value="逃げる" />逃げる<br>

とvalueを設定してあげる必要があります。

投稿2016/05/19 02:07

退会済みユーザー

総合スコア0

keys

2016/05/19 03:30

できました。ありがとうございます！

行動規範の内容に同意します

ベストアンサー

下記のようにラジオボタンに value 属性を設定するとうまく動きます。

HTML
1<form name="Sample3_form" action="idomu_sample.html">
2<input id="tatakau" name="tatakau" type="radio" value="戦う” />戦う<br>
3<input id="nigeru" name="tatakau"  type="radio" value="逃げる” />逃げる<br>
4<input type="button" value="決断する" onclick="Sample3()">
5</form>

投稿2016/05/19 02:06