Simple addition Quiz for kids


We will now present some real world programs that you can see and extend to do something that will further enhance your understanding. In this example kids are presented with simple addition problems. You need to enter the result of the addition and it will tell if the result is correct or incorrect. 



<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="jquery-1.8.0.min.js">
</script>
<script>
$(document).ready(function(){
var rand1 = Math.round(Math.random()*8+1);
$("input#id2").val(rand1);

var rand2 = Math.round(Math.random()*8+1);
$("input#id3").val(rand2);

  $("input#id4").blur(function(){
     
    var x = $("input#id4").val();
    var y = Number($("input#id2").val()) + Number($("input#id3").val());
   if ( y == Number($("input#id4").val())) {var msg ="Correct";
   $("span#id5").html(msg );}

   else {var msg ="InCorrect";
$("span#id5").html(msg );
   }

  });
});
</script>
</head>
<body>

<input id ="id2" type="text" value ="Generate"  style="border: none" readonly>
<br />
+<input id ="id3" type="text" value ="Generate"  style="border: none" readonly>
<br />
<input  id="id4" type="text">
<br />
<span id ="id5">Enter Result</span> <br />

</body>
</html>


You may like to try this example here.