So I've managed to make a simple and easy quiz with Javascript, mainly with an array with both questions and answers (as of now, only numbers).

['How many moons does Earth have?', 1],
['How many moons does the saturn have?', 31],
['How many moons does venus have?',0]

I also have a function that adds to the score if the answer is right.

function asQuestion(question) {
var answer = prompt(question[0], '');
if (answer == question[1]) {

    score++;
} 

For now, I only have prompts, which is a bit tacky and not quite what I wanted. What I'm looking for is, how can I store those questions with multiple answers (only one of which is correct)? And is it possible to, instead of using prompts, use a <p>, literal or a form, to write these questions, hit button, fadeOut the answered question, and give a new one?

(Example: Question 1: Radio1(What is the capitol of Finland) Radio2(What is the biggest ocean). I check radio 1, and hit 'Next Question'.

Just looking for some advice, tips and guidance as I am quite new to Javascript and jQuery. I really appreciate all the help I can get. =)

有帮助吗?

解决方案

Your question is a bit too broad for Stack Overflow, but here are a few guidelines.

Yes, all you said is possible! You can start from something as simple as:

['How many moons does Earth have?', 1, 0, 2, 3]

knowing that the first answer is correct and shuffling them for your presentation.

You can even make a separate button for each answer (improving the UX by getting rid of a redundant click) but beware of accidental clicks in that case. It's all up to you.


Here is a super-simple quiz I made for you: http://jsfiddle.net/rTv97/ There are millions of ways to improve it, of course. But it should get you started.

Note the system I used:

['How many moons does the saturn have?', 1, 31, 35, 29, 48]
             \        /                  ^    \         /
                text                 correct    answers

It goes: question text, correct answer index (one-based), answers. So, number 1 here means the the first of the 4 answers (31, 35, 29, 48) is correct.

许可以下: CC-BY-SA归因
不隶属于 StackOverflow
scroll top