定时器重置功能不起作用！

Question

大家好！

我一直在尝试为我最新的 jQuery 插件创建一个简单的示例代码，但它似乎根本不起作用！谁能告诉我哪里出了问题？或者任何人都可以为我提供一个新功能来做到这一点。所以我的问题是，当我将鼠标悬停在一个名为 trigger 的元素上时，另一个名为 eg 的元素应该 fadeIn(); 但如果用户取出在类 eg 的元素淡入之前，鼠标不应再淡入，但这根本不起作用。我不知道出了什么问题？请帮帮我。 （下面是我的问题 HTML nad Jquery 代码！）

---

HTML 代码

<div class="trigger">MouseOverMe</div>
<div class="eg">See Me!</div>

---

JQUERY 代码

function timereset(a)
{
 var elem = $('.'+a);
 if(elem.data('delay')) { clearTimeout(elem.data('delay')); }
}

$(document).ready(function () {
   $('div.eg').hide();
    $('div.trigger').mouseover(function () {
        $('div.eg').delay(1000).fadeIn();
    }); 
    $('div.trigger').mouseout(function () {
       timereset('eg');
       $('div.eg').fadeOut();
    });
});

---

提前致谢

Answer 1

您不需要 timereset 东西，只需在对象上调用 stop() ，之前的效果就会停止：

http://api.jquery.com/stop/

根据新评论更新：

$('div.trigger').mouseout(function () {
   $('div.eg').stop().hide();
});

Answer 2

jQuery

$('.trigger').hover(function() {
    $('.eg').delay(1000).fadeIn();
}, function() {
    $('.eg').stop(true, true).hide();
});

小提琴： http://jsfiddle.net/UJBjg/1

Answer 3

另一种选择是清除排队的功能，例如：

$('div.trigger').mouseout(function () {
       $('div.eg').queue('fx', []);
       $('div.eg').fadeOut();
    });

请记住，如果淡出/淡入已经通过使用 stop 开始，则最终可能会出现半透明元素。

编辑

这是一个示例：http://jsfiddle.net/Qchqc/

Answer 4

var timer = -1;
$(document).ready(function () {
   $('div.eg').hide();
    $('div.trigger').mouseover(function () {
        timer = window.setTimeout("$('div.eg').fadeIn(function() { timer = -1; });",1000);
    }); 
    $('div.trigger').mouseout(function () {
       if(timer != -1)
          window.clearTimeout(timer);

       $('div.eg').fadeOut();
    });
});