triadmoko/game-edukasi-matematika.markdown

## game-edukasi-matematika.markdown

      
    Raw
  

              game-edukasi-matematika.markdown
            
          
    Game Edukasi Matematika

A Pen by Triadmoko Denny Fatrosa on CodePen.
License.

  
## index.html
<!DOCTYPE html>
<html>
<head>
    <title>Membuat Game Edukasi Menggunakan Jquery</title>
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
    <script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
</head>
<body>
    <div class="container">
        <div class="row">
            <div class="col text-center">
                <h3>Membuat Game Edukasi Menggunakan Jquery</h3>
                <p>Pertanyaan : <span id="number1" class="badge badge-primary"></span> + <span id="number2" class="badge badge-primary"></span></p>
                <label for="">Silahkan masukkan jawaban kamu !</label>
                <br>
                <input type="text" id="total">
                <button onclick="result()" class="btn btn-primary">Submit</button>
            </div>
        </div>
    </div>

</body>

</html>

## script.js

    function myFunction() {
      var x = Math.floor((Math.random() * 10) + 1);
      var y = Math.floor((Math.random() * 10) + 1);
      $("#number1").text(x);
      $("#number2").text(y);
    }
    myFunction()
    function result(){
        var num1 = $("#number1").text();
          var num2 = $("#number2").text();
          var result = parseInt(num1)+parseInt(num2);
          var total = $("#total").val();
          if(total==result){
              alert("Yeay. Jawaban Kamu Benar !");
              $("#total").val("");
          }else{
              alert("Yah. Jawaban Kamu Salah, Coba Lagi ya!")
          }
    }
	<!DOCTYPE html>
	<html>
	<head>
	<title>Membuat Game Edukasi Menggunakan Jquery</title>
	<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
	<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
	</head>
	<body>
	<div class="container">
	<div class="row">
	<div class="col text-center">
	<h3>Membuat Game Edukasi Menggunakan Jquery</h3>
	<p>Pertanyaan : <span id="number1" class="badge badge-primary"></span> + <span id="number2" class="badge badge-primary"></span></p>
	<label for="">Silahkan masukkan jawaban kamu !</label>
	<br>
	<input type="text" id="total">
	<button onclick="result()" class="btn btn-primary">Submit</button>
	</div>
	</div>
	</div>

	</body>

	</html>

	function myFunction() {
	var x = Math.floor((Math.random() * 10) + 1);
	var y = Math.floor((Math.random() * 10) + 1);
	$("#number1").text(x);
	$("#number2").text(y);
	}
	myFunction()
	function result(){
	var num1 = $("#number1").text();
	var num2 = $("#number2").text();
	var result = parseInt(num1)+parseInt(num2);
	var total = $("#total").val();
	if(total==result){
	alert("Yeay. Jawaban Kamu Benar !");
	$("#total").val("");
	}else{
	alert("Yah. Jawaban Kamu Salah, Coba Lagi ya!")
	}
	}