Im working on Quiz Web App. I Just code a simple question.
but now I want To Ask The Question 5 Times.
i tried using for loop and also while loop but its didn't work.
i used lot off setTimeout functions here,
where user click on start button i want that question ask 5 times and count how many answers are right and how many answers are wrong.
How Can i do That ?
<?php
$btn1 = '<button id="optiona" class="btn btn-primary">2</button>';
$btn2 = '<button id="optionb" class="btn btn-primary">5</button>';
$btn3 = '<button id="optionc" class="btn btn-primary">11</button>';
$btn4 = '<button id="optiond" class="btn btn-primary">0</button>';
$btnArray = [$btn1, $btn2, $btn3, $btn4];
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Welcome</title>
<link rel="stylesheet" href="css/bootstrap.css">
<script src="js/jquery.js"></script>
<style>
#question{
margin: 10px 50px;
padding: 20px 40px;
box-shadow: 0 12px 16px 0;
font-size: 2em;
}
#options{
margin: 50px;
padding: 10px;
}
#options, button{
margin: 10px;
padding: 100px;
width: 50px;
}
</style>
</head>
<body>
<h1 id="hqid">Question<span id="qid"></span></h1>
<div class="container">
<button id="start" class="btn btn-primary">Start</button>
<div id="game">
<h1 id="question">What is 1 + 1 ?</h1>
<div id="options">
<?php
shuffle($btnArray);
print_r($btnArray[0]);
print_r($btnArray[1]);
print_r($btnArray[2]);
print_r($btnArray[3]);
?>
</div>
</div>
</div>
<script>
$('#hqid, #game').hide();
$(document).ready(function(){
localStorage.clear();
var count = 1;
//Check if you have a stored value
if (localStorage.getItem("count") === null) {
localStorage.setItem("count", 1);
}
count = localStorage.getItem("count");
$("button#start").on("click", function(){
$('#start').hide();
$('#hqid, #game').show();
$('h1 span').html(count);
$('#optiona, #optionb, #optionc, #optiond').click(function(){
$('#game').load('#options');
if(count < 6){
count++;
localStorage.setItem("count", count);
//process your code
//example
//END of the code
$('h1 span').html(count);
if(count == 6){
//get to default
localStorage.setItem("count", 1);
$('#start').show();
$('#hqid, #game').hide();
//go somewhere else
}
}
});
return false;
});
});
</script>
</body>
</html>
This Is Whole Code.
its looks messy but its working.