如何在mouseenter/mouseleave上多次停止触发切换事件?

Tom*_*ter 4 javascript jquery

我正在使用jQuery切换<div>使用jQuery切换方法的可见性.在mouseenter和mouseleave事件上触发切换,从而创建div在mouseenter上折叠并在mouseleave上折叠的效果.问题是,如果用户将鼠标拖过<div>几次然后离开<div>,则div将进行多次切换.如果用户意外地移动了<div>are中的鼠标指针,就会发生这种情况.有谁知道如何避免这种行为?

感谢名单!

cle*_*tus 7

两件事情:

  1. 如果您要使用两者mouseenter,mouseleave我建议使用该hover()功能; 和

  2. 使用触发动画时,开始使用该stop()方法是一个好习惯.

所以:

$("div.someclass").hover(function() {
  $("...").stop().fadeIn("slow");
}, function() {
  $("...").stop().fadeOut("slow");
});
Run Code Online (Sandbox Code Playgroud)

注意:"..."用适当的选择器替换你正在切换的内容并使用适当的效果(我在这里使用淡入淡出).此外,this在事件处理程序中引用事件的来源.