Help with basic Javascript (timers)

Asked

Viewed 159 times

3

my question is this::

<!DOCTYPE html>
<html dir="ltr" lang="pt-BR">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Joguinho</title>

<link rel="stylesheet" href="style.css">
</head>


<body>
    <div id="container">
        <?php
            $contador = 0;

            $random1 = (rand(1,10));
            $random2 = (rand(1,10));
            $resultado = $random1 * $random2;

            $contador++;
                echo("<div id='contador'>".$contador."/10"."</div>");
                echo("<div id='campo'>".$random1."x".$random2."</div>");
        ?>  
        <input id="digiteValor" type="text" />   
        <button id="enviar" onclick="chama()">Enviar</button>
        <div id="certoOuErrado"></div>
    </div>
</body>
    <script type="text/javascript">
        function chama(){
        var valorDigitado = document.getElementById('digiteValor').value;   
        var resultado = "<?php echo $resultado; ?>";
        //var correto = "<div id='correto'></div>";
        //var incorreto = "<div id='incorreto'></div>";

            if(resultado == valorDigitado){
                document.getElementById('certoOuErrado').innerHTML = "CORRETO";
                //document.getElementById('certoOuErrado').innerHTML = correto;
                } else {
                document.getElementById('certoOuErrado').innerHTML = "INCORRETO";
                //document.getElementById('certoOuErrado').innerHTML = incorreto;
            }
        }

    </script> 
</html>

that’s the code I’ve made so far

the idea is for the boy to enter the value, wait a while to check if the answer is correct or incorrect. I have an accountant who should count 10 moves, it’s like a loop. Can you refresh the screen and update this data until you make 10 moves? You have to take a little time to answer. for example: has 4seg to answer, after the time is over is checked if the entered value is correct or incorrect, then goes to next iteration.

php javascript

  • To execute a code from there to X milliseconds, use setTimeout(função, X); - or to execute a code each X milliseconds, use setInterval(função, X);. In this function you can update the value of any element, using getElementById (that I saw in your code that you know how to use). Try this, and if you still have difficulties with logic, I’ll come back to give a more complete answer.

  • P.S. I suggest [Edit] the question and bring the relevant code here, instead of just putting a link pro Pastebin (the full code you leave there anyway, only brings relevant snippets to the question).

1 answer

1

Is it even worth using php and having to update the page to generate other random numbers?

You can simply use Math.Random() from javascript for this, this function generates a random number between 0 and 1.

var contador=0;
var acertos=0;
var erros=0;
function comecar(){
  if(contador==10){
  document.getElementById("operacao").innerHTML="acertos: "+acertos+" erros:"+erros;
    return false;
    }
  document.getElementById("resposta").value="";
  document.getElementById("resposta").disabled="";
  contador++;
  document.getElementById("contador").innerHTML=contador+"/10";
  var numero1=Math.floor(Math.random()*100+1);
  var numero2=Math.floor(Math.random()*100+1);
  var resultado=numero1*numero2;
  document.getElementById("operacao").innerHTML=numero1+"x"+numero2;
  document.getElementById("enviar").onclick=function(e){
    var resposta=document.getElementById("resposta");
    resposta.disabled="true";
    if(resposta.value==resultado){
      resposta.value="correto";
      acertos++;
      }else if(resposta.value!=resultado){
        resposta.value="incorreto";
        erros++;
        }
    setTimeout(comecar,1000);
    }
  }
comecar();
<div id="contador"></div>
<div id="operacao"></div>
<input id="resposta"/>
<input id="enviar" value="enviar" type="button">

Browser other questions tagged php javascript

You are not signed in. Login or sign up in order to post.