琐事游戏 jquery 单击后无法显示数组

Question

$(document).ready(function () {
var questions = [{
question: "Who is pokemons current mascot?",
answers: ["clefairy", "pikachu", "greninja", "togepi"],
correctAnswer: 2,
score: 5,
points: 5
}, {
question: "At what level does nidorino evolve?",
answers: ["16", "25", "30 with fire stone", "any level after 16 with moonstone"],
correctAnswer: 4,
score: 10,
points: 10
}, {
question: "In which region does the town of Humilau City belong too?",
answers: ["johto", "kalos", "Unova", "Hoenn"],
correctAnswer: 3,
score: 15,
points: 15
}, {
question: "What was the total number of pokemon to date?",
answers: ["951", "802", "730", "850"],
correctAnswer: 2,
score: 15,
points: 15
}, {
question: "Who's that pokemon?", // will be Swellow img
answers: ["Swellow", "Pelipper", "Pidgeot", "Talonflame"],
correctAnswer: 1,
score: 5,
points: 5
}, {
question: "What year was pokemon released in japan?",
answers: ["December 05, 1995", "Feburary 27, 1996", "March 15, 1996", "April 01, 1995"],
correctAnswer: 2,
score: 10,
points: 10
}, {
question: "What was the first created pokemon?",
answers: ["", "Pikachu", "Rhydon", "Charizard"],
correctAnswer: 3,
score: 5,
points: 5
}, {
question: "What type is Spiritomb",
answers: ["Ghost/ Dark", "Ghost/ psychic", "Dark/ Ghost", "Dark/ Poison"],
correctAnswer: 1,
score: 10,
points: 10
}, {
question: "What hidden ability does sylveon have?",
answers: ["Lightning Rod", "Pixilate", "Unnerve", "Vital Spirit"],
correctAnswer: 2,
score: 15,
points: 15
}, {
question: "IV stands for what?",
answers: ["Intravenous", "Independant Values", "Individual Variation", "Individual Values"],
correctAnswer: 4,
score: 10,
points: 10
}];
var updatedQuestion = 0;
var correctAnswers = 0;
$("#q_a").hide();
$("#playGame").click(function () {
$(".rules").hide();
$("#q_a").show();
});
//Get first question
function firstQuestion() {
for (let i = 0; i < questions.length; i++) {
$("#question").html(questions[i].question);
//Loop through question array and create buttons for each answer
// Clear button div of any newly created buttons
$("#answers").empty();
for (let i = 0; i < questions[i].answers.length; i++) {
var a = $("<button>");
}
};
};
});

<title>Trivia game </title>
<meta charset="utf-8" />
<link rel="stylesheet" href="css/main.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<main class="startingPage" id="startPage">
<h1 class="pageTitle">CWD3500 - ASSIGNMENT 1 - Intro to js Libs W/ jQuery - TRIVIA X 10</h1>
<hr> QUESTION #: <input id="qNumber"> POINTS: <input id="points"> SCORE #: <input id="score">
<hr>
<div id="q_a">
<p id="questions">test </p>
<ul id="anwsers">
</ul>
<button id="nextQuest">NEXT QUESTION</button>
</div>
<div class="rules">
<p class="paragraph"> Welcome to Trivia X 10! You 'll be asked 10 questions, one at a time and be given n4 anwsers. Click on the choice to choose your answer the question. Each one is worth either 5, 10 or 15 points, depending on difficulty. Answer each on correctly for a score of 100 points. Click the button below to get started.</p>
<button id="playGame" class="gamePlay">CLICK TO PLAY!</button>
</div>
</main>

单击"开始"按钮后，我的数组将不会显示，并且我对如何显示它们有点迷茫。我尝试了一些没有运气的事情，我的老师喜欢用最愚蠢的方式解释它。 (抱歉，除非我添加更多描述并且我不知道还要添加什么来解释我的代码，否则此重复不会让我发布(

Answer 1

在这里，我在初始代码上取得了一些进展，这将循环浏览您的所有问题并在单击下一个问题时显示答案。

现在休息，您必须处理逻辑以获得正确的所选答案并增加分数值并显示。

	let questions = [
			{
question: "Who is pokemons current mascot?",
answers: ["clefairy", "pikachu", "greninja", "togepi"],
correctAnswer: 2,
score: 5,
points: 5
		    },
{
question: "At what level does nidorino evolve?",
answers: ["16", "25", "30 with fire stone", "any level after 16 with moonstone"],
correctAnswer: 4,
score: 10,
points: 10
		    },
{
question: "In which region does the town of Humilau City belong too?",
answers: ["johto", "kalos", "Unova", "Hoenn"],
correctAnswer: 3,
score: 15,
points: 15
		    },
{
question: "What was the total number of pokemon to date?",
answers: ["951", "802", "730", "850"],
correctAnswer: 2,
score: 15,
points: 15
		    },
{
question: "Who's that pokemon?", // will be Swellow img
answers: ["Swellow", "Pelipper", "Pidgeot", "Talonflame"],
correctAnswer: 1,
score: 5,
points: 5
		    },
{
question: "What year was pokemon released in japan?",
answers: ["December 05, 1995", "Feburary 27, 1996", "March 15, 1996", "April 01, 1995"],
correctAnswer: 2,
score: 10,
points: 10
		    },
{
question: "What was the first created pokemon?",
answers: ["", "Pikachu", "Rhydon", "Charizard"],
correctAnswer: 3,
score: 5,
points: 5
		    },
{
question: "What type is Spiritomb",
answers: ["Ghost/ Dark", "Ghost/ psychic", "Dark/ Ghost", "Dark/ Poison"],
correctAnswer: 1,
score: 10,
points: 10
		    },
{
question: "What hidden ability does sylveon have?",
answers: ["Lightning Rod", "Pixilate", "Unnerve", "Vital Spirit"],
correctAnswer: 2,
score: 15,
points: 15
		    },
{
question: "IV stands for what?",
answers: ["Intravenous", "Independant Values", "Individual Variation", "Individual Values"],
correctAnswer: 4,
score: 10,
points: 10
		    }
];
		var updatedQuestion = 0;
		var correctAnswers = 0;
		$("#q_a").hide();
		$("#playGame").click(function () {
			$(".rules").hide();
			$("#q_a").show();
			firstQuestion();
		});
		$("#nextQuest").click(function () {
			firstQuestion();
		});

//Get first question
		function firstQuestion() {
			let curQnNumber = $('#qNumber').val();
			if(curQnNumber === ""){
				curQnNumber = 0;
			}
			if (curQnNumber == 10) {
				curQnNumber=0;
}
$("#questions").html(questions[curQnNumber].question);
				//Loop through question array and create buttons for each answer
				// Clear button div of any newly created buttons
var ul = $("ul").empty();
$.each(questions[curQnNumber].answers, function(prop, val){
					ul.append("<li>"+val+"</li>");
});
			curQnNumber ++;
			$('#qNumber').val(curQnNumber);
		}

<title>Trivia game </title>
<meta charset="utf-8" />
<link rel="stylesheet" href="css/main.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<main class="startingPage" id="startPage">
<h1 class="pageTitle">CWD3500 - ASSIGNMENT 1 - Intro to js Libs W/ jQuery - TRIVIA X 10</h1>
<hr> QUESTION #: <input id="qNumber"> POINTS: <input id="points"> SCORE #: <input id="score">
<hr>
<div id="q_a">
<p id="questions"> </p>
<ul id="anwsers">
</ul>
<button id="nextQuest">NEXT QUESTION</button>
</div>
<div class="rules">
<p class="paragraph"> Welcome to Trivia X 10! You 'll be asked 10 questions, one at a time and be given n4 anwsers. Click on the choice to choose your answer the question. Each one is worth either 5, 10 or 15 points, depending on difficulty. Answer each on correctly for a score of 100 points. Click the button below to get started.</p>
<button id="playGame" class="gamePlay">CLICK TO PLAY!</button>
</div>
</main>