mouseenter 和 mouseleave 在 jquery 中不起作用

Question

我正在测试我的网站，添加一些 jQuery 互动。我创建了这个脚本：

$(document).ready(function() {
    $('.flash').on({
        mouseenter: function (
            $('.flash').hide();
    },
    mouseleave: function  {
        $('.flashOn').show();
    }
});

非常简单地触发闪光灯：http://www.paolobergomi.it/sitob/index.html但实际上我不知道为什么不起作用。我调试了很多但是是一样的。 div 已正确放置在 HTML 中如您所见，脚本没问题（我认为）但它不起作用，欢迎提供任何线索。

Answer 1

当您使用正确的语法时，

mouseenter 和 mouseleave 在 jQuery 中工作正常：

$('.flash').on({
    mouseenter: function() {
        $('.flashOn').hide();
    },
    mouseleave: function() {
        $('.flashOn').show();
    }
});

Example fiddle

我还假设 mouseenter 处理程序应该隐藏 .flashOn 元素？

Answer 2

mouseenter 和 mouseleave 有语法错误。

$('.flash').on({
   mouseenter: function ( // here should be (){
    $('.flashOn').hide();
   },
   mouseleave: function { // here should be (){
    $('.flashOn').show();
   }
});

Answer 3

最终解决方案

$('.flash').on ({
    mouseenter : function (){

    $('.flash').hide();
    $('.flashOn').show();
},
   mouseleave: function  (){
    $('.flashOn').hide();
    $('.flash').show();

 }
});

感谢正确的语法，现在可以了

mouseenter 和 mouseleave 在 jquery 中不起作用

mouseenter and mouseleave dont work in jquery

jquery

image

mouseenter

mouseleave