jQuery悬停在同一个元素上

时间:2012-04-12 20:52:37

标签: javascript jquery

使用jQuery悬停,你如何检查你是否只是再次徘徊在同一个元素上?假设我有两个盒子并悬停在盒子1上,然后离开,然后回来并悬停在同一个盒子上。我想存储初始悬停元素的值(方框1),然后在悬停时比较它是否相同。

谢谢!

3 个答案:

答案 0 :(得分:2)

尝试以下内容,

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
});

答案 1 :(得分:0)

使用.data()http://api.jquery.com/data/这样首先在回调中悬停做类似的事情

if (!$(this).data('var')) {
    $(this).data('var','value');
} else {
    console.log($(this).data('var'));
};

答案 2 :(得分:0)

var lastHovered = null;
$('#selector1,#selector2,#selector3').hover(function (evt) {
    if(lastHovered && lastHovered === $(this).attr("id")){
//code for 're-hovering'
    }else{
//code for 'new hover'
    }
}, function (evt) {
    //mouse out stuff
    lastHovered  =  $(this).attr("id");
});