setTimeout não espera 9 segundos

Boa tarde

O meu problema é o seguinte o temporizador setTimeout() não espera os 9 segundos que especifiquei para executar a função, não sei o porquê disso acontecer. Ele é chamado dentro de um bloco else, antes disso tem um pequeno script que troca o fundo de uma div, ai depois de 9 segundos ele viria e também trocaria o fundo, mas ele vem antes.

Meu código :

TV Script

	  <div id="borda">
	    <div id="tela">
		
		</div>
		
		<div id="liga-desliga" onclick="LigaDesligaTv()">
		</div>
		
		<div id="muda1">
		</div>
		
		<div id="muda2">
		</div>
	  
	    </div>
	  
	  <div id="controle">
	    <div id="led">
		</div>
	    <button id="power" onclick="LigaDesligaTv()">p</button>
		<button id="Bum">1</button>
		<button id="Bdois">2</button>
		<button id="Btres">3</button>
		<button id="Bquatro">4</button>
		<button id="Bcinco">5</button>
		<button id="Bseis">6</button>
		<button id="Bsete">7</button>
		<button id="Boito">8</button>
		<button id="Bnove">9</button>
	  
	  </div>
	  
	  
	  <script>
	  
	  var cont = 0;
		
	  function desligada(){
	    document.getElementById("tela").style.backgroundImage = "url('imagens/batman.jpeg')";
	  }
	  
	  function LigaDesligaTv(){
	    
		
		if(cont == 0){
	    document.getElementById("tela").style.backgroundImage = "url('imagens/tvchiado.gif')";
		cont++;
	    }
	    else{
	    document.getElementById("tela").style.backgroundImage = "url('imagens/tvdesligando.gif')";
		setTimeout(desligada(),9000);
		cont = 0;
	    }
		
	   
	}
	  
	  
	  </script>




</body>

Source:

Se vc não souber mexer no codepen, me avisa q mando o source aqui


P: Pq não funcionou com vc?
R: pq vc fez isso:

setTimeout(desligada(),9000);

Sendo que o correto é

setTimeout(function(){
   desligada();
},9000}

Segue a documentação:

https://developer.mozilla.org/pt-BR/docs/Learn/JavaScript/Asynchronous/Timeouts_and_intervals

2 curtidas

Quando você faz desligada() (com os parênteses), está chamando a função, e o retorno dela que é passado para setTimeout. Mas a função desligada não retorna nada.

Só que setTimeout - segundo a documentação - deve receber como parâmetro uma função, então você tem que passar a própria função, assim:

setTimeout(desligada, 9000);

Ou seja, passe apenas a função (desligada, sem os parênteses), assim setTimeout a chamará depois dos 9 segundos.


Claro, também poderia fazer como sugerido acima pelo @rodriguesabner :

setTimeout(function(){
   desligada();
}, 9000);

Mas neste caso, criar uma função anônima que só chama a função desligada me parece redundante, pois neste caso apenas passar a própria função desligada diretamente me parece o suficiente.

Uma função anônima seria interessante se você precisasse fazer mais coisas ali dentro:

setTimeout(function(){
   // faz outras coisas aqui além de desligar...
   desligada();
   // faz mais coisas aqui...
}, 9000);
2 curtidas

Rapaz, citei a doc e nem sabia que dava pra chamar a function direto assim kkkkkk, valeu @hugokotsubo!

2 curtidas

Vlw funcionou aqui e era só um erro bobo kk.

Vlw man me salvou.