悬停事件在jQuery中触发两次（在回车和离开时）？

我将此效果应用于我的菜单，因此当鼠标移动到链接上时，它会显示此淡入淡出效果，但当鼠标从中释放时，效果会再次播放。不应该。当鼠标悬停在链接上时，它应该只播放一次，而不是在鼠标退出时再次播放。

.hover（）

有两个回调，一个用于

mouseenter

，另一个用于

mouseleave

使用

mouseenter

可能会更好：

$(document).ready(function(){
    $("#menu a").hover(function(){
        $(this).animate({opacity: 0.25}, function(){
            $(this).animate({opacity: 1});
        });
    });
});

尝试：

试试这个。在hoverout事件上添加$（this）.stop（）

$("#menu a").hover(
  function () {
    $(this).animate({opacity: 0.25}, function(){
            $(this).animate({opacity: 1});
        });
  }, 
  function () {
    //do nothing
  }
);

---

使用jQuery v1.7试试这个

   $(document).ready(function () {
            $("#menu a").hover(function () {
                $(this).animate({ opacity: 0.25 }, function () {
                    $(this).animate({ opacity: 1 });
                });
            }, function () { $(this).stop(); });
        });

---

你必须检查是否得到相同的对象

例如：

$('#menu a').on({
    mouseover: function() {
        event.preventDefault();
        $(this).animate({opacity: 0.25});
    },
    mouseout: function() {
        event.preventDefault();
        $(this).animate({opacity: 1});
    }
});

---

如果您想在悬停时发射一次，请使用鼠标指针：

$('#updateCart').on('mouseenter', function (event) {
        if (event.handled !== true) { .....
                  //Put your code in here
          }
}

---

jQuery

.hover（）

事件处理

mouseenter

和

mouseleave

，而不是

mouseover

和

mouseout

@developius:

。mouseover（）

是

上（'mouseover'）

@Blender的快捷方式，但这不是推荐的方法，因为你不能像diEcho的回答那样做。mouseenter是正确的，根据文档：“当鼠标进入一个元素时”。

$('#updateCart').on('mouseenter', function (event) {
        if (event.handled !== true) { .....
                  //Put your code in here
          }
}

$("element").mouseenter(function(){
    //event here
});