2

Tenho duas funções que precisam interagir na mesma DIV.

# ambienteEdit(this);

A função dela é que ao manter a DIV pressionada por 3 segundos, seja aberto a tela de confirm() do javascript, passando o ID.

# vistoriaIniciar(this);

Essa função, ao clicar apenas uma vez na DIV seja encaminhado para outra outra tela passando alguns parâmetros.

Tentativa:

<div class="lista fade" onclick="ambienteEdit(this);vistoriaIniciar(this)">

vistoriaIniciar(), funciona, mas o ambienteEdit() não funciona. Se eu removo o vistoriaIniciar() a função ambienteEdit() funciona.

Pergunta:

Como fazer para ter os dois eventos na mesma DIV?

Obrigado.

function ambienteEdit(object) {
   let aID     = object.getElementsByClassName('aID')[0].value;

   let delay;
   document.addEventListener("mousedown", function() {
     delay = setTimeout(_ => confirm("Dialogo"), 3000)
   });

   document.addEventListener("mouseup", function() {
     clearTimeout(delay);
   });

   console.log(aID)
}



function vistoriaIniciar(object) {
  let aID     = object.getElementsByClassName('aID')[0].value;
  let aCodigo = object.getElementsByClassName('aCodigo')[0].value;
  let aNome   = object.getElementsByClassName('aNome')[0].value;

  window.location='vistoriaIniciar.html?codigo='+aCodigo+'&ambiente='+aNome+'&id_ambiente='+aID;
}
<div class="lista fade" onclick="ambienteEdit(this);vistoriaIniciar(this)">
  BLA BLA BLA
</div>

6
  • Aparece algum erro no CONSOLE? 14/01/2020 às 12:12
  • @PauloHDSousa Sem erro, só não executa o ambienteEdit.
    – Tiago
    14/01/2020 às 12:12
  • Porque você quer que o sistema aguarde 3 segundos para abrir uma confirmação? 14/01/2020 às 12:15
  • Dá uma olhada aqui: stackoverflow.com/a/52751982/11890088 14/01/2020 às 12:16
  • 1
    Adicionar deliberadamente a todo click um document.addEventListener está errado, tanto na sua pergunta quanto nas respostas, não é assim que se usa os eventos ouvintes, pode até funcionar, mas não está correto e vai registrando uma série de coisas que não estarão mais sendo usadas, consumindo o que não faz nada após a primeira adição.
    – Syzoth
    14/01/2020 às 13:07

2 Respostas 2

2

O evento onclick só vai ser disparado se você clicar e soltar. Com isso, o document.addEventListener("mousedown"... só será criado se isso acontecer ao menos uma vez.

Chame a função ambienteEdit num atributo de evento onmousedown na div:

<div class="lista fade" onclick="vistoriaIniciar(this)" onmousedown="ambienteEdit(this)">

E a função ficará assim:

function ambienteEdit(object) {
   let aID     = object.getElementsByClassName('aID')[0].value;

   let delay = setTimeout(_ => confirm("Dialogo"), 3000)

   document.addEventListener("mouseup", function() {
     clearTimeout(delay);
   });

   console.log(aID)
}
1

Você está fazendo um redirect no método vistoriaIniciar()

window.location='vistoriaIniciar.html?codigo='+aCodigo+'&ambiente='+aNome+'&id_ambiente='+aID;

E está esperando 3 segundos para rodar o confirm no método ambienteEdit()

O que acontece é que o redirect está acontecendo antes de 3 segundos, por isso parece que seu método não foi chamado, mas ele simplesmente está esperando os 3 segundos.

Por isso que ele funciona quando você tira vistoriaIniciar(), porque não tem redirect.

Para resolver faça o seguinte, mova o seu método ambienteEdit para o LOAD da pagina e remova ele do onclick da div, vai ficar assim.

<script>

    window.onload = function load() {
         var div =  document.getElementById("onPressDiv");
        ambienteEdit(div);
    }

function ambienteEdit(object) {
   let aID     = object.getElementsByClassName('aID')[0].value;

   let delay;
   document.addEventListener("mousedown", function() {
     delay = setTimeout(_ => confirm("Dialogo"), 3000)
   });

   document.addEventListener("mouseup", function() {
     clearTimeout(delay);
   });

   console.log(aID)
}



function vistoriaIniciar(object) {
  let aID     = object.getElementsByClassName('aID')[0].value;
  let aCodigo = object.getElementsByClassName('aCodigo')[0].value;
  let aNome   = object.getElementsByClassName('aNome')[0].value;

  window.location='vistoriaIniciar.html?codigo='+aCodigo+'&ambiente='+aNome+'&id_ambiente='+aID;
}
   </script>

E sua div.

<div class="lista fade" id="onPressDiv" onclick="vistoriaIniciar(this)">
            BLA BLA BLA
        </div>
4
  • Qual seria a solução?
    – Tiago
    14/01/2020 às 12:22
  • @Thiago Eu não sei o que você quer fazer, eu separaria os métodos, REDIRECT em um elemento e abrir o confirm em outro 14/01/2020 às 12:25
  • Se clicar uma vez na DIV, vai para outra tela. Se clicar e segurar por 3 segundos, abre o confirm.
    – Tiago
    14/01/2020 às 12:29
  • @Thiago tenta desse modo. 14/01/2020 às 12:35

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 .