1

Boas pessoal,

Precisava de alterar o valor de retorno ao clicar no botão, ou seja, primeiramente o click teria que retornar false e passados x segundos teria que retornar true e prosessguir com o evento.

O código é o seguinte:

$(".btnnext").on("click",function (e) {

if (newText != "" || newText2 != "" || newText3 != "" || newText4 != "") {

                
    var teste = false;
    

    setTimeout((function () {
        teste = true;
        console.log(teste);

        $(".btnnext").trigger("click");
        return teste;
    }), 2000);

    return teste;
   
}});

A minha abordagem passava por primeiro retornar falso e posteriormente com a função setTimeout alterar o valor de retorno e simular o clique de novo no botão. Problema: O valor de retorno é alterado mas o evento não avança, o segundo clique não funciona.

FOTO

O que pretendo é que ao clicar no botão, por exemplo, quando passa do passo 2 para o 3, demore um x segundos

7
  • A questão é que lógica você está a tentar atingir com isto ? Porque certamente terá formas mais simples e direta para tal
    – Isac
    Commented 7/08/2018 às 9:41
  • @Isac acredito que haja uma forma mais simples, esta foi só a minha abordagem se houver uma mais fácil/direta melhor. O objetivo principal é ao clicar no botão parar o evento provocado por ele (ficar no mesmo DOM x segundos) e depois avançar. Commented 7/08/2018 às 10:07
  • 1
    Explique por palavras e coisas visuais o que você quer quer aconteça, e não como está a tentar resolver o problema. Quer clicar num botão e que ele permaneça uns segundos na página e depois seja removido é isso ?
    – Isac
    Commented 7/08/2018 às 10:22
  • O melhor é mesmo usar ajax para fazer o pedido ao backend e apenas quando obtiver a resposta do ajax atualiza a página e/ou navega para outro local. Assim faz tudo como é suposto e sem gambiarra.
    – Isac
    Commented 7/08/2018 às 10:28
  • 1
    Como estás a despoletar no backend o inicio de fazer as contas? Podes adicionar essa informação a resposta? A mim parece-me que a sugestão do @Isac é a ideal, ao clicar no botão, fazer pedido AJAX e quando recebes o resultado do servidor, redireccionas o utilizador para a página seguinte.
    – Leite
    Commented 7/08/2018 às 10:41

2 Respostas 2

3

Alterei a resposta, veja se se encaixa em algo semelhante a sua necessidade.

$('input').click(() => {
  
  $('input').attr('disabled','true');
  var cor = getRandomColor();
  var i = 1;
  var interval = setInterval(() => {
    //Toda sua logica vai ser feita aqui! 
    if(!$('#div'+i)[0]){
      clearInterval(interval);
      $('input').removeAttr('disabled');
      return;
    };
    $('#div'+i).css('background',cor);
    i++;
  },2000);
  
});

function getRandomColor() {
  var letters = '0123456789ABCDEF';
  var color = '#';
  for (var i = 0; i < 6; i++) {
    color += letters[Math.floor(Math.random() * 16)];
  }
  return color;
}
div{
  width: 50px;
  height: 50px;
  float:left;
  margin-left: 5px;
  background: red;
}

input{
  float:left;
  width: 100%;
  margin-top: 20px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="div1"></div>
<div id="div2"></div>
<div id="div3"></div>
<div id="div4"></div>
<input type="button" value="Start">

7
  • Desde já obrigado pela resposta. Esta solução tem um problema, o clique no botão não me para a alteração do DOM (ou página). Eu já tinha testado por o botão disable ou até a função preventDefault(), mas nada funciona Commented 7/08/2018 às 10:56
  • @AdrianoMaia, posso alterar a resposta pra sua necessidade, você quer parar a alteração no dom ? o que exatamente quer que aconteça quando o usuário clicar nele, tente falar da forma bem básica pra que eu possa te ajudar Commented 7/08/2018 às 10:58
  • Eu editei a minha pergunta veja se ajuda Commented 7/08/2018 às 10:59
  • Mas basicamente eu quero que quando ele passa do passo 2 para o 3 (com o clique do botão que está representado no código) ele demore x segundos, porque, quando ele passa de etapa alguns campos são escondidos, o que leva a que o DOM se altere e as contas saiam trocadas. Commented 7/08/2018 às 11:07
  • Ok, vou alterar a resposta! Commented 7/08/2018 às 11:15
1

Acabei por resolver o problema da seguinte forma (um pouco trivial e, talvez, um bocado estranha):

e.stopPropagation();

Primeiro paro a propagação do evento proveniente do clique no link.

Depois faço o um novo clique no mesmo link passados x segundos:

setTimeout(function () { $('.next #btnnext').unbind().trigger('click') }, 200);

O meu maior erro foi estar a clicar num botão com uma classe definida e não um id. No meu caso a adição da classe disable não funcionava.

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 .