Erro “jQuery mouseenter is not a function” no Drupal

  • Tempo de leitura: 2 min.

Solução

Se você chegou aqui com esse problema está querendo logo a solução, sem enrolação. Substitua o

$('seletor_aqui').mouseenter(function() {})

por

$('seletor_aqui').bind('mouseenter', function() {})

A solução também vale para a função mouseleave.

O que não funciona

Substituir o mouseenter por mouseover ou o mouseleave por mouseout não funciona, pois as funções tem comportamento semelhantes, mas não idênticos. A mouseleave não é chamada se você passar o mouse sobre um elemento filho, mas a mouseout sim.

Exemplo

Uma div A e dentro dela uma div B. São associadas à div A as quatro funções (mouseenter, mouseover, mouseleave e mouseout).

Se você entrar na div A são disparados os dois eventos, mouseenter e mouseover. A diferença está quando você passa o mouse sobre a div B: a mouseleave não é disparada, enquanto a mouseout sim, porque teoricamente você está saindo da div A para entrar na B. Voltando com o mouse da div B para a div A é disparado o mouseover mas não é disparado o mouseenter. Saindo da div A são disparados o mouseleave e o mouseout.

Deu pra entender?

Felipe Elia

Associate Director of Platform Engineering na 10up, WordPress Core Contributor, Global Polyglots Mentor na comunidade internacional do WordPress e Locale Manager na comunidade WordPress Brasil.

Este post tem um comentário

  1. Felipe Meirelles

    Muito bom, eu estava quebrando cabeça aqui pra resolver essa chumbalha e agora matou o problema. Valeu filho!

Comentários encerrados.