let myQuestions = [
{
question: "What's 2 2?",
answers: [
{ text: "4", correct: true },
{ text: "2", correct: false },
{ text: "10", correct: false },
{ text: "1", correct: false },
],
},
{
question: "What's 10 10?",
answers: [
{ text: "20", correct: true },
{ text: "2", correct: false },
{ text: "18", correct: false },
{ text: "0", correct: false },
],
},
];
function showQuestion(questionAndAnswers) {
const shuffledAnswers = _.shuffle(questionAndAnswers.answers);
questionTag.innerText = questionAndAnswers.question;
answerTag[0].innerText = shuffledAnswers[0].text;
answerTag[1].innerText = shuffledAnswers[1].text;
answerTag[2].innerText = shuffledAnswers[2].text;
answerTag[3].innerText = shuffledAnswers[3].text;
}
document.querySelectorAll(".answer").forEach((correctAnswer) => {
correctAnswer.addEventListener("click", (event) => {
if (myQuestions.answers == true) {
console.log("s");
}
});
})基本上，我的問題也在一個陣列中，答案也在一個物件中，問題被放在螢屏上，答案被打亂了。我需要幫助的是下面的最后一段代碼，如何檢查單擊的值是否為真（正確答案）。
<h3 id="question"></h3>
<div class="answers">
<button id="answer1" class="answer"></button>
<button id="answer2" class="answer"></button>
<button id="answer3" class="answer"></button>
<button id="answer4" class="answer"></button>
</div>uj5u.com熱心網友回復：
向答案標簽添加一個屬性，指示它是否是正確答案。然后你可以在事件監聽器中檢查。
let myQuestions = [
{
question: "What's 2 2?",
answers: [
{ text: "4", correct: true },
{ text: "2", correct: false },
{ text: "10", correct: false },
{ text: "1", correct: false },
],
},
{
question: "What's 10 10?",
answers: [
{ text: "20", correct: true },
{ text: "2", correct: false },
{ text: "18", correct: false },
{ text: "0", correct: false },
],
},
];
function showQuestion(questionAndAnswers) {
const shuffledAnswers = _.shuffle(questionAndAnswers.answers);
questionTag.innerText = questionAndAnswers.question;
shuffledAnswers.forEach(({text, correct}, i) => {
answerTag[i].innerText = text;
answerTag[i].dataset.correct = correct;
};
}
document.querySelectorAll(".answer").forEach((answer) => {
answer.addEventListener("click", (event) => {
if (event.target.dataset.correct == 'true') {
console.log("s");
}
});
})轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/418255.html
標籤：