0

Tenho um problema no seguinte código:

        $("button").each(function(index){       
            // add the class
            setTimeout(function(){
                $(this).addClass("varrimento");
            }.bind(this),index*5000);
            // remove the class
            setTimeout(function(){
                $(this).removeClass("varrimento");
            }.bind(this),(index+1)*5000); 
        });

Este código serve para adicionar a classe "varrimento" aos elementos de uma página (neste caso são botões) em que é adicionado a vez, um a um durante 5 segundos e depois removido. Só que há dois problemas:

  • quando mudo de página e volto para a página inicial, adiciona novamente um a um mas como interrompi "a meio" na primeira visita, é como se o setTimeout tivesse em stand by e quando volto a pagina continua onde ficou, o que faz com que a class esteja a ser adiciona aos botões não da forma que pretendo.
  • Ao mudar de página (na primeira mal o load da página é feito, a class começa logo a ser adicionada aos botões), a pagina seguinte demora +/- 15 segundos a começar a adicionar a classe, sem motivo aparente para haver essa demora. A única coisa que difere é o numero de botões que é maior.

Já estou há vários dias a tentar resolver isto, mas sem sucesso. Alguma ajuda pff?

5
  • O browser suspende quando mudas de página, talvez daí que o setTimeout também pare... Podes explicar melhor "a pagina seguinte demora +/- 15 segundos a começar a adicionar"? não vejo razão para isso neste código
    – Sergio
    27/07/2016 às 11:08
  • Pois a questao é mesmo essa, tambem nao vejo razão para isso. o que a class esta a fazer é dar flash nos botoes, aparecem e desaparecem durante 5 segundos. logo na primeira pagina começa logo a acontecer, ao mudar para a segunda, que tem mais 3 botoes demora esse tempo a começar a por a classe nos botoes
    – Tiago Pina
    27/07/2016 às 11:17
  • Consegues reproduzir esse problema num jsFiddle?
    – Sergio
    27/07/2016 às 11:18
  • vou tentar e caso consiga coloco aqui. mas quanto a questao que disseste do setTimeout, nao estou a usar num browser mas sim numa app mobile com phonegap
    – Tiago Pina
    27/07/2016 às 11:52
  • @TiagoPina Resolveu seu problema?
    – Matheus
    2/08/2016 às 17:44

1 Resposta 1

1

Tente implementar sua lógica usando setInterval(), onde é executado em um intervalo definido, e pode-se parar a realização da função.

    var timerId = setInterval(function () {
        //Faz alguma coisa aqui!
        if(condicao == true){
            //Termina a execução
            clearInterval(timerId);
        }
    },5000);

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 .