HOW TO CREATE A SIMPLE RANDOM QUIZ WITH JAVASCRIPT AND HTML
Code: _______________________________________________________________ <!DOCTYPE html> <html lang="en" xmlns="http://www.w3.org/1999/xhtml"> <head> <meta charset="utf-8" /> <title>Random Questions</title> </head> <body> <p id="message001">This country's capital is <text id="name001"></text>.</p> <div id="disappear001"> <input type="text" id="input001" /><button onclick="submit001()">Submit</button> </div> <p id="answer001"></p> <p id="button001"></p> <script> var capitals001 = ["Jerusalem", "London", "Washington DC", "Addis Ababa"]; var countries001 = ["Palestine", "UK", "USA", "Ethiopia"]; var random001 = Math.floor(Math.random() * capitals001.length); function submit001() { var b = input001.value; if (random001 == 0 && b == countries001[0]) { document.getElementById("answer001").innerHTML = "Correct.."; document.getElementById("button001").innerHTML = "<button onclick=btn001()>Next</button>"; document.getElementById("disappear001").innerHTML = ""; } else if (random001 == 1 && b == countries001[1]) { document.getElementById("answer001").innerHTML = "Correct.."; document.getElementById("button001").innerHTML = "<button onclick=btn001()>Next</button>"; document.getElementById("disappear001").innerHTML = ""; } else if (random001 == 2 && b == countries001[2]) { document.getElementById("answer001").innerHTML = "Correct.."; document.getElementById("button001").innerHTML = "<button onclick=btn001()>Next</button>"; document.getElementById("disappear001").innerHTML = ""; } else if (random001 == 3 && b == countries001[3]) { document.getElementById("answer001").innerHTML = "Correct.."; document.getElementById("button001").innerHTML = "<button onclick=btn001()>Next</button>"; document.getElementById("disappear001").innerHTML = ""; } else { document.getElementById("answer001").innerHTML = "Incorrect.."; document.getElementById("button001").innerHTML = "<button onclick=btn001()>Next</button>"; document.getElementById("disappear001").innerHTML = ""; } } document.getElementById("name001").innerHTML = capitals001[random001]; function btn001() { random001 = Math.floor(Math.random() * capitals001.length); document.getElementById("name001").innerHTML = capitals001[random001]; document.getElementById("button001").innerHTML = ""; document.getElementById("disappear001").innerHTML = "<input type=text id=input001 /><button onclick=submit001()>Submit</button>"; document.getElementById("answer001").innerHTML = ""; } </script> </body> </html> If you want to watch the video and see how it is done, you can check it out below. |
OTHER RELATED PAGES: |