おしえて

aを選択したら正解、それ以外ははずれ、選んでない場合は別途メッセージを出したい

解決済

質問者：kemukemu2014
質問日時：2017/01/22 23:40
回答数：5件

すいません。質問があります。
タイトルの通りですが、aを選択したら正解、それ以外ははずれ、選んでない場合は別途メッセージを出したいです。

下記のコードの場合、挙動がおかしいのですが…。

お手数ですが何卒よろしくお願いいたします。

<!DOCTYPE html>

<html lang = "ja">
<head>
<meta charset = "UTF-8">

</head>

<body>
<p>果物の種類は？</p>
<form name="form1">
<input type="radio" name = "q1" id = "qu1"> a) りんご</br>
<input type="radio" name = "q1" id = "qu1"> b) みかん</br>
<input type="radio" name = "q1" id = "qu1"> c) ばなな</br>
<input type="radio" name = "q1" id = "qu1"> d) いちご</br>
</br>
<input type ="button" value="答え" onclick="saiten()" />
<p id="quiz1"></p>
</form>
</body>

<script>

function saiten(){
var element = document.getElementById("qu1");
if(document.form1.q1[0].checked){
quiz1.innerHTML = "正解";

}else if(document.form1.q1[1,2,3].checked){
quiz1.innerHTML = "はずれ。正解は(a)です";

}else if(element.checked == false){
quiz1.innerHTML = "答えにチェックを入れてください！"
}
}

</script>
</html>

通報する

この質問への回答は締め切られました。

質問の本文を隠す

回答 (5件)

No.1

回答者： runix2007
回答日時：2017/01/23 00:14

javascriptはよう知らんけど

>>else if(document.form1.q1[1,2,3].checked)

「b,c,dがチェックされている場合」としたいんだろうけど、この書き方はダメんじゃないかなぁ。１つずつ書かなきゃ
a1がチェックされている場合は正解、どれもチェックされていない場合はチェックを促す、それ以外は正解を表示にすればいいんじゃない？

さらに
>>
<input type="radio" name = "q1" id = "qu1"> a) りんご</br>
<input type="radio" name = "q1" id = "qu1"> b) みかん</br>
<input type="radio" name = "q1" id = "qu1"> c) ばなな</br>
<input type="radio" name = "q1" id = "qu1"> d) いちご</br>

idっていうのは唯一無二だから、全部にqu1とするのは文法的に誤り

- 0
- 件

通報する

この回答へのお礼

ありがとうございます！

通報する

お礼日時：2017/01/29 09:48

No.2

回答者： Ogre7077
回答日時：2017/01/23 00:30

<form name=form1>

<input type=radio name=q1 value=a> a) りんご</br>
<input type=radio name=q1 value=b> b) みかん</br>
<input type=radio name=q1 value=c> c) ばなな</br>
<input type=radio name=q1 value=d> d) いちご</br>
</br>
<button type=submit>答え</button>
<p><output name=quiz1></output>
</form>

<script>
function makeSaiten(q,a,p) {
return function(){
var m, v, el = this.elements[q];
for (var i in el) if (el[i].checked) v = el[i].value;
if (v == a) {
m = "正解";
} else if (v) {
m = "はずれ。正解は" + a + "です";
} else {
m = "答えにチェックを入れてください！";
}
this.elements[p].value = m;
return false;
};
}
window.onload = function(){
document.forms['form1'].onsubmit = makeSaiten('q1', 'a', 'quiz1');
};
</script>

- 0
- 件

通報する

この回答へのお礼

ありがとうございます！

通報する

お礼日時：2017/01/29 09:48

No.3

回答者：フォームゴミリン
回答日時：2017/01/24 08:09

くわしく分かりませんが…

[1,2,3]は指定できないのでは？

もし、１～３

- 0
- 件

通報する

この回答へのお礼

ありがとうございます！

通報する

お礼日時：2017/01/29 09:48

No.4

回答者：フォームゴミリン
回答日時：2017/01/24 08:19

を指定するならば、if(条件1 && 条件2 && 条件3)と記述する事によって、全て真の時に実行することができますよ～

- 0
- 件

通報する

この回答へのお礼

ありがとうございます！

通報する

お礼日時：2017/01/29 09:48

No.5ベストアンサー

回答者： Kirito16.com
回答日時：2017/01/25 20:48

<body>

<p>果物の種類は？</p>
<form name="form1">
<input type="radio" value= "q1" id="qu1"> a) りんご</br>
<input type="radio" value= "q2" id="qu1"> b) みかん</br>
<input type="radio" value= "q3" id="qu1"> c) ばなな</br>
<input type="radio" value= "q4" id="qu1"> d) いちご</br>
</br>
<input type ="button" value="答え" onclick="saiten()" />
<p id="quiz1"></p>
</form>
</body>

<script>

function saiten(){
var element = document.forms.form1.qu1.value;
var r = "";
if(element = q1){
document.getElementById("quiz1").innerHTML = "正解";
} if(element == r){
document.getElementById("quiz1").innerHTML = "答えにチェックを入れて下さい!";
}else{
document.getElementById("quiz1").innerHTML = "はずれ。正解は(a)です";
}
}

[説明]
フォーム以外のIDを操作する場合↓
document.getElementById("ID名").innerHTML = "";
フォームの内容を取得↓
document.forms.フォームID.タグID.value;

スペルミスがあるかも...