Designing a math quiz, like this, is pretty simple. All it does, is generate a random math question, by generating two random digits and a random operator (either addition, subtraction, or multiplication).
The random question is generated using functions that are stored in a separate file. This simplifies things somewhat, since these functions are used multiple times, and there's no point in having the same block of code repeating multiple times in the same file.
There's another function used to calculate the correct answer. Which is nice.
Functions compact the code, and make it reusable. The file doesn't have a big block of code dedicated to a single function that could be easily reused elsewhere. And if I do use it elsewhere, and want to improve it. I can do so on every page it's used, by editing a single file.
Once someone enters an answer to the math question, they're automatically redirected back to this page, which checks their answer, and increments their score if it's correct. It also increments the count of the number of questions they've answered, and provides a new question, while displaying their last question, and the correct answer.
In order to make the quiz more user friendly, I set an id and anchor so the page would jump to the quiz after the user submits their answer. Because by default, after answering every question, they'll find themselves at the top of the page; and considering this insanely long description I'm writing, that's just not on.
I also included something that allows the user to avoid using the mouse altogether: The autofocus attribute in the answer text box tells the browser to let the user enter their answer immediately, by placing the focus directly on it. Unfortunately, this is an HTML5 attribute, and is not proper XHTML. However, autofocus aside, the rest of the document is fully XHTML compliant. Which I'm actually quite proud of. That took a bit of work.
In the end, this is just a fun little quiz. So have fun!
