teratail
回答率
85.30%
teratail header banner
teratail header banner
質問するログイン新規登録
トップに関する質問カウントが0になったら残りの問題全てを不正解にしたい

編集履歴

質問編集履歴

11

修正

2020/07/01 15:26

投稿

begine
begine

スコア7

title CHANGED
File without changes
body CHANGED
@@ -144,4 +144,7 @@
144
144
 
145
145
  ### 補足情報（FW/ツールのバージョンなど）
146
146
 
147
+ ```ここに言語を入力
148
+ const accuracy = correct + wrong === 0 ? 0 : correct / (correct + wrong) * 100;
149
+ ```
147
- ここにより詳細な情報を記載してください。
150
+ 不正解の数ではなく、質問の数で計算させることにしました。

10

修正

2020/07/01 15:26

投稿

begine
begine

スコア7

title CHANGED
File without changes
body CHANGED
@@ -8,33 +8,10 @@
8
8
  【解決したいこと】
9
9
  時間切れだった時に残りの問題全てを不正解カウントさせたい。
10
10
 
11
-
12
- 以下のブロック内の「currentNum = quizSet.length - 1;」と「isAnswered = true;」が関係しているかなと思って試したりしたのですが、解決できません。
13
-
14
-
15
-
16
-
17
-
18
11
  よろしくお願いします。
19
12
 
20
- ```ここに言語を入力
21
- if(timeLeft < 0){ 　//カウントが0のときの処理
22
- clearTimeout(timerId);
23
- timeLeft = 0;
24
- updateTimer(timeLeft);
25
13
 
26
- btn.classList.remove('disabled');
27
- btn.textContent = '結果発表';
28
- currentNum = quizSet.length - 1;//ここを試してみた
29
- isAnswered = true; 　　　　　　//ここを試してみた
30
- return;
31
- }
32
14
 
33
- }
34
- ```
35
-
36
-
37
-
38
15
  ### 発生している問題・エラーメッセージ
39
16
 
40
17
  ```

9

修正

2020/07/01 14:57

投稿

begine
begine

スコア7

title CHANGED
@@ -1,1 +1,1 @@
1
- カウントが0になった時、残りの問題を不正解で処理させたい
1
+ カウントが0になったら残りの問題全てを不正解にしたい
body CHANGED
@@ -1,16 +1,20 @@
1
1
  ### 前提・実現したいこと
2
- カウントダウンタイマー付きのクイズ問題を作成しているのですが、時間切れした後の正答率表示が間違っています。
2
+ カウントが0で終了するクイズ問題を作成しています。
3
3
 
4
- 時間以内に答えられたときの正答率は正しいのですが、時間切れ後の正答率表示がおかしいです。
4
+ 条件演算子とテンプレートリテラルを使い、カウントが0になったら残りの問題全てを不正解にしたいと考えているのですが、なかなか思い通りにいきません。
5
5
 
6
6
 
7
+
7
8
  【解決したいこと】
8
- 時間切れだった時に、次以降のクイズを不正解でカウントさせたい。
9
+ 時間切れだった時に残りの問題全てを不正解カウントさせたい。
9
10
 
10
11
 
11
- 以下のブロック内が関係しているかなと思い試してみたりしたのですが、解決することができませんでした。
12
+ 以下のブロック内の「currentNum = quizSet.length - 1;」と「isAnswered = true;」が関係しているかなと思って試したりしたのですが、解決できません。
12
13
 
13
14
 
15
+
16
+
17
+
14
18
  よろしくお願いします。
15
19
 
16
20
  ```ここに言語を入力
@@ -21,8 +25,8 @@
21
25
 
22
26
  btn.classList.remove('disabled');
23
27
  btn.textContent = '結果発表';
24
- currentNum = quizSet.length - 1;
28
+ currentNum = quizSet.length - 1;//ここを試してみた
25
- isAnswered = true; //ここを試してみた
29
+ isAnswered = true; 　　　　　　//ここを試してみた
26
30
  return;
27
31
  }
28
32
 

8

修正

2020/07/01 13:44

投稿

begine
begine

スコア7

title CHANGED
@@ -1,1 +1,1 @@
1
- 時間切れだった時、次以降のクイズを不正解でカウントさせたい
1
+ カウントが0になった時、残りの問題を不正解で処理させたい
body CHANGED
@@ -4,7 +4,6 @@
4
4
  時間以内に答えられたときの正答率は正しいのですが、時間切れ後の正答率表示がおかしいです。
5
5
 
6
6
 
7
-
8
7
  【解決したいこと】
9
8
  時間切れだった時に、次以降のクイズを不正解でカウントさせたい。
10
9
 
@@ -15,7 +14,7 @@
15
14
  よろしくお願いします。
16
15
 
17
16
  ```ここに言語を入力
18
- if(timeLeft < 0){
17
+ if(timeLeft < 0){ 　//カウントが0のときの処理
19
18
  clearTimeout(timerId);
20
19
  timeLeft = 0;
21
20
  updateTimer(timeLeft);

7

修正

2020/07/01 12:30

投稿

begine
begine

スコア7

title CHANGED
File without changes
body CHANGED
@@ -23,7 +23,7 @@
23
23
  btn.classList.remove('disabled');
24
24
  btn.textContent = '結果発表';
25
25
  currentNum = quizSet.length - 1;
26
- isAnswered = true;
26
+ isAnswered = true; //ここを試してみた
27
27
  return;
28
28
  }
29
29
 

6

修正

2020/07/01 12:16

投稿

begine
begine

スコア7

title CHANGED
@@ -1,1 +1,1 @@
1
- クイズ問題で、時間切れ後のクイズ正答率が間違っている
1
+ 時間切れだった時、次以降のクイズを不正解でカウントさせたい
body CHANGED
File without changes

5

修正

2020/07/01 12:15

投稿

begine
begine

スコア7

title CHANGED
File without changes
body CHANGED
@@ -4,6 +4,11 @@
4
4
  時間以内に答えられたときの正答率は正しいのですが、時間切れ後の正答率表示がおかしいです。
5
5
 
6
6
 
7
+
8
+ 【解決したいこと】
9
+ 時間切れだった時に、次以降のクイズを不正解でカウントさせたい。
10
+
11
+
7
12
  以下のブロック内が関係しているかなと思い試してみたりしたのですが、解決することができませんでした。
8
13
 
9
14
 
@@ -18,7 +23,7 @@
18
23
  btn.classList.remove('disabled');
19
24
  btn.textContent = '結果発表';
20
25
  currentNum = quizSet.length - 1;
21
- isAnswered = false;
26
+ isAnswered = true;
22
27
  return;
23
28
  }
24
29
 
@@ -66,7 +71,7 @@
66
71
  btn.classList.remove('disabled'); // Nextボタンのdisabledを解除する
67
72
  btn.textContent = '結果発表'; // Nextボタンの表示は「結果発表」にする
68
73
  currentNum = quizSet.length - 1; // 最終問題まで終わったとする
69
- isAnswered = false;
74
+ isAnswered = true;
70
75
  return; //clearTimeout()したら次のcountDown()を呼び出したくないためreturnする
71
76
  }
72
77
 

4

修正

2020/07/01 12:14

投稿

begine
begine

スコア7

title CHANGED
@@ -1,1 +1,1 @@
1
- カウントダウンタイマー付きのクイズで時間切れした後のクイズ正答率表示がおかしい
1
+ クイズ問題で、時間切れ後のクイズ正答率が間違っている
body CHANGED
File without changes

3

修正

2020/07/01 12:00

投稿

begine
begine

スコア7

title CHANGED
File without changes
body CHANGED
@@ -4,7 +4,7 @@
4
4
  時間以内に答えられたときの正答率は正しいのですが、時間切れ後の正答率表示がおかしいです。
5
5
 
6
6
 
7
- 以下のブロック内が関係しているかなと思い、isAnswered = true; の true のところを、false や wrong などにし試してみたりしたのですが、解決することができませんでした。
7
+ 以下のブロック内が関係しているかなと思い試してみたりしたのですが、解決することができませんでした。
8
8
 
9
9
 
10
10
  よろしくお願いします。
@@ -18,7 +18,7 @@
18
18
  btn.classList.remove('disabled');
19
19
  btn.textContent = '結果発表';
20
20
  currentNum = quizSet.length - 1;
21
- isAnswered = true;
21
+ isAnswered = false;
22
22
  return;
23
23
  }
24
24
 
@@ -38,54 +38,53 @@
38
38
 
39
39
  ```javascript
40
40
 
41
- const correctLavel = document.getElementById('correct');
41
+ const correctLavel = document.getElementById('correct'); // 正解
42
- const wrongLavel = document.getElementById('wrong');
42
+ const wrongLavel = document.getElementById('wrong'); // 不正解
43
43
 
44
-
44
+
45
45
  let correct = 0;
46
46
  let wrong = 0;
47
+
48
+
49
+ document.addEventListener('DOMContentLoaded', function() {　//画面表示したら以下を発火
50
+ startTime = Date.now();
51
+ countDown();
52
+ });
47
53
 
48
- function countDown() {
54
+ function countDown() {
49
55
  timerId = setTimeout (function() {
56
+ //timerIdをsetTimeoutの返り値として取得 次の処理を指定したミリ秒後に実行(1度だけ)
57
+
50
58
  timeLeft = timeToCountDown - (Date.now() - startTime);
51
-
59
+ //elapsedTimeは、1度しか使わないので直接代入した↑
52
60
 
53
- if(timeLeft < 0){
61
+ if(timeLeft < 0){ //残り時間が0より小さくなったらclearTimeoutを呼ぶ(タイマー停止)
54
62
  clearTimeout(timerId);
55
- timeLeft = 0;
63
+ timeLeft = 0; //timeLeftを0にして、updateTimerで更新する
56
64
  updateTimer(timeLeft);
57
65
 
58
- btn.classList.remove('disabled');
66
+ btn.classList.remove('disabled'); // Nextボタンのdisabledを解除する
59
- btn.textContent = '結果発表';
67
+ btn.textContent = '結果発表'; // Nextボタンの表示は「結果発表」にする
60
- currentNum = quizSet.length - 1;
68
+ currentNum = quizSet.length - 1; // 最終問題まで終わったとする
61
- isAnswered = true;
69
+ isAnswered = false;
62
- return;
70
+ return; //clearTimeout()したら次のcountDown()を呼び出したくないためreturnする
63
71
  }
64
72
 
65
- updateTimer(timeLeft);
73
+ updateTimer(timeLeft); // 呼び出し(渡すミリ秒はtimerLeft)
66
- countDown();
74
+ countDown(); //countDownを再帰的に呼び出したいため、ここで呼ぶ。
67
75
  }, 10);
68
76
  }
69
77
 
70
78
 
71
- sbtn.addEventListener('click', function() {
79
+ sbtn.addEventListener('click', function() { //STARTボタンがクリックされたらタイマーON
72
- startTime = Date.now();
80
+ startTime = Date.now(); // 押したときの時刻を取得
73
- countDown();
81
+ countDown(); /* カウントダウン機能は setTimeoutを使い再帰的に実行させるため countDown() という名前の別関数にする。*/
74
82
  });
75
83
 
76
-
77
-
78
84
  let currentNum = 0;
79
85
  let isAnswered;
80
86
  let score = 0;
81
87
 
82
- function shuffle(arr) {
83
- for (let i = arr.length - 1; i > 0; i--) {
84
- const j = Math.floor(Math.random() * (i + 1));
85
- [arr[j], arr[i]] = [arr[i], arr[j]];
86
- }
87
- return arr;
88
- }
89
88
 
90
89
  function checkAnswer(li) {
91
90
  if (isAnswered) {
@@ -94,11 +93,11 @@
94
93
  isAnswered = true;
95
94
 
96
95
  if (li.textContent === quizSet[currentNum].c[0]) {
97
- li.classList.add('correct');
96
+ li.classList.add('correct');　　　　
98
97
  score++;
99
98
  correct++;
100
99
  } else {
101
- li.classList.add('wrong');
100
+ li.classList.add('wrong');　　　
102
101
  wrong++;
103
102
  }
104
103
 
@@ -144,10 +143,10 @@
144
143
  const accuracy = correct + wrong === 0 ? 0 : correct / (correct + wrong) * 100;
145
144
  if (currentNum === quizSet.length - 1) { //最終問題だったらスコアを表示
146
145
  scoreLabel.innerHTML = `${quizSet.length} <br>
147
- ${score} <br>
146
+ ${score}<br>
148
147
  ${accuracy.toFixed(2)}%`;
149
148
  result.classList.remove('hidden');
150
- } else {
149
+ } else { //違ったら次の問題へ
151
150
  currentNum++;
152
151
  setQuiz();
153
152
  }

2

修正

2020/07/01 11:56

投稿

begine
begine

スコア7

title CHANGED
File without changes
body CHANGED
@@ -4,7 +4,7 @@
4
4
  時間以内に答えられたときの正答率は正しいのですが、時間切れ後の正答率表示がおかしいです。
5
5
 
6
6
 
7
- 以下のブロック内が関係しているかなと思い、isAnswered = falseの false のところを、false や wrong などにし試してみたりしたのですが、解決することができませんでした。
7
+ 以下のブロック内が関係しているかなと思い、isAnswered = true; の true のところを、false や wrong などにし試してみたりしたのですが、解決することができませんでした。
8
8
 
9
9
 
10
10
  よろしくお願いします。

1

修正

2020/07/01 11:34

投稿

begine
begine

スコア7

title CHANGED
@@ -1,1 +1,1 @@
1
- javascript、 時間切れした後のクイズ正答率表示がおかしい
1
+ カウントダウンタイマー付きのクイズで時間切れした後のクイズ正答率表示がおかしい
body CHANGED
@@ -1,16 +1,27 @@
1
1
  ### 前提・実現したいこと
2
- カウントダウンタイマー付きのクイズ問題を作成しているのですが、時間切れした後の正答率が間違っています。
2
+ カウントダウンタイマー付きのクイズ問題を作成しているのですが、時間切れした後の正答率表示が間違っています。
3
3
 
4
4
  時間以内に答えられたときの正答率は正しいのですが、時間切れ後の正答率表示がおかしいです。
5
5
 
6
6
 
7
- 以下のブロック内が関係しているかなと思って試していたのですが、解決することができません。
7
+ 以下のブロック内が関係しているかなと思い、isAnswered = falseの false のところを、false や wrong などにし試してみたりしたのですが、解決することができませんでした。
8
8
 
9
+
9
10
  よろしくお願いします。
10
11
 
11
12
  ```ここに言語を入力
12
- if(timeLeft < 0){
13
+ if(timeLeft < 0){
14
+ clearTimeout(timerId);
15
+ timeLeft = 0;
16
+ updateTimer(timeLeft);
13
17
 
18
+ btn.classList.remove('disabled');
19
+ btn.textContent = '結果発表';
20
+ currentNum = quizSet.length - 1;
21
+ isAnswered = true;
22
+ return;
23
+ }
24
+
14
25
  }
15
26
  ```
16
27
 
@@ -20,7 +31,7 @@
20
31
 
21
32
  ```
22
33
  時間切れ後の正答率が違う。
23
- (全３問中１問正解だったら正答率が50%となっています)
34
+ (全３問中１問正解だったら正答率が50%となってしまいます。)
24
35
  ```
25
36
 
26
37
  ### 該当のソースコード
@@ -109,7 +120,7 @@
109
120
  li.textContent = choice;
110
121
  li.addEventListener('click', () => {
111
122
  checkAnswer(li);
112
- if (currentNum === quizSet.length - 1) clearTimeout(timerId); // ★最終問題に回答したらタイマー止める
123
+ if (currentNum === quizSet.length - 1) clearTimeout(timerId); // 最終問題に回答したらタイマー止める
113
124
  });
114
125
  choices.appendChild(li);
115
126
  });