I have created the following code:
$(".awesome").click(function () {
var toStore = $("input[name=name]").val();
if (/^[A-Za-z]+ [A-Za-z]+$/.test(toStore)) {
$("#contain").children().fadeOut(1000);
$("#contain").delay(1000).queue(function () {
$("#contain").append("<h1>Welcome to My Quiz : " + toStore + "</br>" +
"You'll Get 10 Questions To Answer </br> " +
"Here Is the First One:Who is Prime Minister of the United Kingdom? </h1>");
var allQuestions = [
{question: "Who is Prime Minister of the United Kingdom?",
choices: ["David Cameron",
"Gordon Brown",
"Winston Churchill",
"Tony Blair"],
correctAnswer: 0}
];
$("#contain").append("<form><input type='radio' name='ans1' value='David Cameron'>David Cameron</br>" +
" <input type='radio' name='ans1' value='Gordon Brown'>Gordon Brown</br>" +
"<input type='radio' name = 'ans1' value = 'Winston Churchill' > Winston Churchill </br>" +
"<input type='radio' name='ans1' value='Tony Blair'>Tony Blair</br>" +
"<input type='submit' value='Submit' name='submit'></form>");
$("input[name=submit]").click(function () {
var correctAnswer;
if ($("input[name=ans1]").val()) {
var x = "choices";
allQuestions[x] = "David Cameron";
for (var x in allQuestions) {
return correctAnswer = false;
if (allQuestions[x] === "David Cameron") {
return correctAnswer = true;
} else {
return correctAnswer = false;
}
}
}
});
});
} else {
alert("Please Input a Valid Name");
}
});
});
In this scenario, I have defined an Object named "allQuestions" with three properties: "question," "choices," and "correct answer." There is also a submit button that checks the input value under the name "ans1". If the answer is "David Cameron," the correctAnswer property will be updated to 1 instead of the initial value of 0. Suggestions on how to achieve this are welcome!