setTimeout与Mouseenter结合使用无效的解决方法

Question

$(".item-holder").each(function(){
    $(this).bind("mouseenter", function(e) {
        e.preventDefault();
        var t = setTimeout(function(){
            $(this).find(".mindex-blog-meta").animate({
                left:"0"
            },500);
            $(this).find(".ret").animate({
                top:"60%"
            },600);
        });
    },300)
});

$(".item-holder").each(function(){
    $(this).bind("mouseleave", function(e) {
        e.preventDefault();
        clearTimeout(t);
        $(this).find(".mindex-blog-meta").animate({
            left:"-60%"
        },500);

        $(this).parent().find(".ret").animate({
            top:"100%"
        },600);
    });
});

Answer 1

1. 碰到多个元素需要绑定相同事件处理的，改用事件代理，即把事件绑到这些元素的公共父元素上，然后用选择器命中指定元素即可。具体方法去看文档；

2. 想要clearTimeout()，变量得能找的到，你在匿名函数里声明的变量t，困在作用域里完全出不来啊~

3. 没必要setTimeout，jQ的动画不是还有delay呢么。

4. clearTimeout()的效果，用stop实现吧。