jQueryホバーを使用して、同じ要素にもう一度ホバーしたかどうかをどのように確認しますか?2つのボックスがあり、ボックス1にカーソルを合わせてから左に移動し、戻って同じボックスにカーソルを合わせたとします。最初にホバーした要素(ボックス1)の値を保存してから、ホバーバックしたときに同じであるかどうかを比較したいと思います。
ありがとう!!
jQueryホバーを使用して、同じ要素にもう一度ホバーしたかどうかをどのように確認しますか?2つのボックスがあり、ボックス1にカーソルを合わせてから左に移動し、戻って同じボックスにカーソルを合わせたとします。最初にホバーした要素(ボックス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
});
注: box1ホバーとbox2ホバーの機能がまったく異なると仮定して2つの関数を使用しました...そうでない場合は、同じ関数内に配置して、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
});
.data()http://api.jquery.com/data/を使用して、コールバックの最初のホバーで次のようにします。
if (!$(this).data('var')) {
$(this).data('var','value');
} else {
console.log($(this).data('var'));
};
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");
});