Question

使用以下代码：

$('someelement').hover(
    function() {
        console.log('mouseenter begin');
        setTimeout(function() {
            console.log('mouseenter ends');
        }, 2000);
    },
    function() {
        console.log('mouseleave begin');
        setTimeout(function() {
            console.log('mouseleave ends');
        }, 2000);
    }
)

如果我进入和离开div有时（或一次少于2秒）我的控制台得到：

mouseenter begin
mouseleave begin
mouseenter ends
mouseleave ends

我希望只在mouseenter结束时执行mouseleave，但不知道如何。

mouseenter begin
mouseenter ends
mouseleave begin
mouseleave ends

Answer 1

你可以创建一个队列......

http://jsfiddle.net/FHPGS/

var queue = []

$('someelement').hover(
    function() {
        queue.push('mouseenter begin');
        setTimeout(function() {
            var item = queue.shift();
            if (item)
                console.log(item)
            console.log('mouseenter ends');
        }, 2000);
    },
    function() {
        queue.push('mouseleave begin');
        setTimeout(function() {
            var item = queue.shift();
            if (item)
                console.log(item)
            console.log('mouseleave ends');
        }, 2000);
    }
)

只有当mouseenter结束时才进行Mouseleave

1 个答案: