0

Gente eu consegui de um amigo aqui do fórum um script de um botão com contagem regressiva, que ao clicar se inicia a contagem. Agradeço muito porque é muito bom... só tem um problema, quando clico mais de uma vez no botão a contagem regressiva se acelera, veja o código↓

<script language="JavaScript">
  function dispara( span ) {
    conta( this, document.getElementById( span ) );
  }

  function conta( botao, contador ) {
    botao.disabled=true;
    if(contador.innerHTML==0) {
      contador.innerHTML = 10;
      botao.disabled=false;
      return false;
    }
    contador.innerHTML = contador.innerHTML - 1;
    setTimeout( function(){conta( botao, contador )}, 1000 );
  }
</script>

<input type="button" value="botao1" onclick="dispara('s1')" class="btn">
<span id="s1">10</span>
<br/><br/>
<input type="button" value="botao2" onclick="dispara('s2')" class="btn">
<span id="s2">10</span>

Poderiam me ajudar a resolver esse problema?

2
  • O this em dispara não é o botão (como a outra função espera), e é isso que está causando o problema.
    – bfavaretto
    Commented 30/06/2016 às 20:40
  • Eu preciso do this, o this serve para pegar o botão clicado, dispensando seu ID
    – MarsS
    Commented 30/06/2016 às 21:07

1 Resposta 1

1

Bom, resolvi assim. Sei que não é a melhor forma possivel, mas é uma soluçao. Como disse o colega ai, ele noa esta pegando o botao com esse this. Entao coloquei o id do botao, é passado para a funcao, e esse id do botao coloquei o mesmo nome da classe do contador, assim o o que ele passa para a funcao é o id do botao e tbm a classe do contador, assim posso encontrar os 2. Olha:

    <script language="JavaScript">
  function dispara( span ) {
    conta( span, document.getElementsByClassName( span )[0]);
  }

  function conta( botao, contador ) {

    document.getElementById(botao).disabled=true;
    if(contador.innerHTML==0) {
      contador.innerHTML = 10;
      document.getElementById(botao).disabled=false;

      return false;
    }
      contador.innerHTML = contador.innerHTML - 1;
    setTimeout( function(){conta( botao, contador )}, 1000 );
  }
</script>

<input type="button" value="botao1" onclick="dispara('s1')" id="s1" class="btn">
<span class="s1">10</span>
<br/><br/>
<input type="button" value="botao2" onclick="dispara('s2')" id="s2" class="btn">
<span class="s2">10</span>

Espero ter ajudado!!!

12
  • 1
    Pode, só lembre de colocar o mesmo id do botao na classe do contador...
    – LocalHost
    Commented 30/06/2016 às 21:53
  • 1
    é só mudar o valor dentro do span para 20, se é que entendi sua duvida
    – LocalHost
    Commented 30/06/2016 às 22:30
  • 1
    pera ai, acho que entendi agora vou tentar aqui
    – LocalHost
    Commented 30/06/2016 às 22:32
  • 1
    Demorei aqui mas consegui hehe, tentei de varias formas para evitar repetir codigo, com array nao deu certo entao, eu adicionei um atributo a mais no contador: <input type="button" value="botao1" onclick="dispara('s1')" id="s1" class="btn"> <span class="s1" value="5">5</span> Ai em vez de quando ele zerar ele receber direto o 10, ele recebe : contador.innerHTML = contador.getAttribute("value");
    – LocalHost
    Commented 30/06/2016 às 23:34
  • 1
    Ai ele volta para o numero que esta no value...
    – LocalHost
    Commented 30/06/2016 às 23:36

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .