1

Estou usando o método is para checar se, após um tempo, o mouse esta dentro ou fora de um elemento. Contudo, por algum motivo, está dando o seguinte erro:

Uncaught TypeError: AuCon.is is not a function

Parte do código:

let AuCon = document.getElementById('AudioConfig');

AuCon.addEventListener('mouseout', Para);
 
function Para() {
    setTimeout(function(){if(AuCon.is(':hover')){AniVoltar}}, 1000);
}

function AniVoltar()
{
  //Código irrelevante.
}
#AudioConfig
{
  display: inline-block;
  width: 50px;
  height: 50px;
  background-color: black;
}
<div id="AudioConfig">
  <!--Conteudo-->
</div>

Nesse código eu fiz literalmente igualzinho estava na documentação.

1 Resposta 1

3

Você está tentando utilizar o método is do jQuery em uma interface nativa do navegador. Como essa interface nativa não implementa o método is, você recebe um erro ao tentar invocar algo que não é uma função.

Vejamos onde o erro é causado:

AuCon.is(':hover')

E, de acordo com esta linha:

let AuCon = document.getElementById('AudioConfig');

A variável AuCon foi atribuída com o resultado da chamada à document.getElementById. Nesse caso, AuCon será um HTMLElement, que é o valor retornado por getElementById.


Uma opção para resolver isso seria utilizar a API do jQuery para buscar por esse elemento. Mas será que realmente vale a pena incluir os 30.4kB do jQuery para isso?

Não! :-) Você pode utilizar o método matches, que foi inspirado no is do jQuery e já é implementado nativamente por grande parte dos navegadores.

Um exemplo:

let AuCon = document.getElementById('AudioConfig');

AuCon.addEventListener('mouseout', Para);
 
function Para() {
  setTimeout(function() {
    if (AuCon.matches(':hover')) {
      AniVoltar()
    }
  }, 1000);
}

function AniVoltar() {
  console.log('Chamou.');
}
#AudioConfig {
  display: inline-block;
  width: 50px;
  height: 50px;
  background-color: black;
}
<div id="AudioConfig">
  <!--Conteudo-->
</div>

Veja que o jQuery não foi necessário — tanto é que nem foi incluído no código. :-)

1
  • 1
    Ai, obrigado cara, sei nem como te agradecer, sucesso!!!
    – JAMDev
    11/02/2021 às 1:22

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 .