ボタンを押しても動かなくなった・・・

my521

総合スコア16

0グッド

0クリップ

投稿2020/06/04 02:39

編集2020/06/07 03:38

}
function finish(){
if (ca == quizzes.length) {
document.getElementById("text_s").innerHTML = "【成績表】<br>"+ "全問正解";
} else {
document.getElementById("text_s").innerHTML = "【成績表】<br>"+wa+"を間違えました。";
}
}
↑このコードをいれてみたのですが、次はボタンを押しても動かなくなりました。

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Script-Type" content="text/javascript">
<title>都道府県クイズ</title>
<script type="text/javascript">
//問題と解答
var quizzes = [
    {q : "1の都道府県名は？", a : "北海道"},
    {q : "2の都道府県名は？", a : "青森県"},
    {q : "3の都道府県名は？", a : "岩手県"},
    {q : "4の都道府県名は？", a : "宮城県"},
    {q : "5の都道府県名は？", a : "秋田県"},
    {q : "6の都道府県名は？", a : "山形県"},
    {q : "7の都道府県名は？", a : "福島県"}
];
var quiz;

window.onload = function(){
    init();
};
	var count = 0;
function init(){
    quiz = quizzes[count];
	document.getElementById("text_q").innerHTML = (count + 1) + "問目";
    //問題用のフォームに表示する
    var questionForm = document.querySelector("#question");
    questionForm.value = quiz.q;
}
function doAnswer(){
    //回答用のフォームに入力した値を取得
    var answerForm = document.querySelector("#answer");
    var answer = answerForm.value;

    //回答用フォームで入力した内容を削除する
    answerForm.value = "";
    
    //入力した内容が正しいか調べる
	var s='';
    if (answer == quiz.a) {
		//正解
		s += "○" + quiz.a
    } else {
        //不正解
        wa += s = "✖" + quiz.a 
    }
	document.getElementById("text_a").innerHTML = s;
	//次の問題を表示
	count++;
	if (count < quizzes.length) {
        next();
	} else {
		//終了
		document.getElementById("text_s").innerHTML = "終了";
	}
}
function next(){
    init();
}
function finish(){
	if (ca == quizzes.length) {
        document.getElementById("text_s").innerHTML = "【成績表】<br>"+ "全問正解";
	} else {
        document.getElementById("text_s").innerHTML = "【成績表】<br>"+wa+"を間違えました。"; 
	}
}
</script>
</head>
<body>
<h1>都道府県クイズ</h1>
<hr>
<div id="text_q"></div><input type="text" id="question" value=""><br>
<input type="text" id="answer" value="">
<input type="button" value="答える"onclick="doAnswer();">
<h2>解答</h2>
<div id="text_a"></div>
<div id="text_s"></div>
<div id="text_t"></div>
</body>
</html>

おかしい場所がありましたら教えてください。

gentaro

2020/06/04 02:43

その「成績表」というのはどうやって出そうと思っているんでしょうか。その仕様と、実装において困っている具体的な問題を提示しましょう。全くできていないものに関して「誰か作ってくれ」というのは丸投げの質問なので推奨されません。 https://teratail.com/help/avoid-asking

BluOxy

2020/06/04 02:51

質問は編集できますので、質問内容を具体的に記載してください。

yambejp

2020/06/04 03:51

とりあえずタグにjavascriptを追加してください問題は都度jsonかなにかを取りにいくということでOKですか？

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

回答1件

「成績表」の詳細が不明だったので、こんな感じかな、で作ってみました。
サンプル

js
1
2//...
3
4var quiz;
5var ca = 0; /* 追加 */
6
7//...
8
9function doAnswer(){
10
11//...
12
13    if (answer == quiz.a) {
14        //正解
15        s += "○" + quiz.a
16        ca++ /* 追加 */
17    } else {
18        //不正解
19        s += "✖" + quiz.a
20    }
21
22//...
23
24        //終了
25        document.getElementById("text_s").innerHTML = "終了<br>【成績表】<br>"+ca+"問正解"; /* 追加 */
26    }
27}
28
29//...
30

質問の変更に合わせて追記

間違えたものが何か分かるものならどのようなものでも構いません

なるほど。
サンプル

js
1
2//...
3
4var quiz;
5var wa = ""; /* 追加 */
6
7//...
8
9function doAnswer(){
10
11//...
12
13    if (answer == quiz.a) {
14        //正解
15        s += "○" + quiz.a
16    } else {
17        //不正解
18        wa += s = "✖" + quiz.a /* 追加 */
19    }
20
21//...
22
23        //終了
24        document.getElementById("text_s").innerHTML = "終了<br>【成績表】<br>"+wa+"を間違えました。"; /* 追加 */
25    }
26
27//...
28