javascript - jQuery 将鼠标悬停在同一元素上

Question

使用 jQuery 悬停，如何检查您是否刚刚再次悬停在同一元素上？假设我有两个框，将鼠标悬停在框 1 上，然后离开，然后返回并将鼠标悬停在同一个框上。我想存储初始悬停元素(框 1)的值，然后比较悬停回来时是否相同。

谢谢!!

Answer 1

尝试如下所示，

var lastHovered = '';

$('#box1').hover(function () {
    if (lastHovered == 'box1') {
       alert('You have hovered on this already');
    }   
    lastHovered = 'box1';

    //Your stuff
}, function () {
    //mouse out stuff
});

$('#box2').hover(function () {
    if (lastHovered == 'box2') {
       alert('You have hovered on this already');
    }   
    lastHovered = 'box2';

    //Your stuff
}, function () {
    //mouse out stuff
});

注意:我使用了 2 个函数，假设 box1 悬停和 box2 悬停具有完全不同的功能...如果没有，您可以将其放在同一函数中并使用 this.id 对它们进行分组..见下文。

var lastHovered = '';

$('#box1, #box2').hover(function () {
    if (lastHovered == this.id) { //<-- used this.id instead of hard-coded value
       alert('You have hovered on ' + this.id + ' already');
    }   
    lastHovered = this.id; //<-- used this.id instead of hard-coded value

    //Your stuff
}, function () {
    //mouse out stuff
});