いつも分かりやすい解説をしてくださり、ありがとうございます。
一点だけ確認したいことがありますので、以下の解説をもとにご質問させていただきます。
「これで正誤判定はうまくいったのですが、このように一度回答したあとに他の選択肢も選べてしまうのは良くないので、次はそのあたりを直していきましょう。」
こちらの解説を実現するため「 isAnswered = false;」で、三つの選択肢にfalseをつけ、クリックしたタイミングで「true」にする。という処理をしていると思いますが、どうしてクリックしていない他の二つの選択肢も「true」にかわるのでしょうか?
わたしの認識では、クリックされると、以下の箇所から処理が開始すると考えているのですが…。
li.addEventListener('click', () => {
checkAnswer(li);
});
choices.appendChild(li);
});
もしかして、関数内にあるクリックイベントなので、以下の箇所から処理が開始し、falseがtrueに変わっているので、その後の選択肢二つともtrueに変わっているのでしょうか?
説明が長くなり申し訳ございませんが、ご回答のほどよろしくお願い致します。
function setQuiz() {
isAnswered = false; ← ここが「true」になる。
question.textContent = quizSet[currentNum].q;
const shuffledChoices = shuffle([...quizSet[currentNum].c])
shuffledChoices.forEach(choice => {
const li = document.createElement('li');
li.textContent = choice;
li.addEventListener('click', () => {
checkAnswer(li);
});
choices.appendChild(li);
});
}
この回答を見るにはプレミアムプランへの登録が必要です
プレミアムプランとは?