jQuery - 当鼠标不超过两个对象时发生'鼠标'事件'

时间:2013-09-03 08:10:07

标签: jquery events mouseleave

如何触发jQuery的

mouseleave

当鼠标不在elementA AND elementB上时的事件?

为了更好地理解,请参阅示例here

包装容器C中的两个元素并从中激活事件不是一种选择, 因为我在两个不同的表格单元格中有elementA和elementB。

我不打算进行多元素选择(,)。我正在努力模仿逻辑AND(&&)。如上所述,当鼠标既不在elementA上也不在elementB上时,必须触发该事件......

我希望你理解我的问题......

3 个答案:

答案 0 :(得分:3)

当鼠标进入任一元素时,这将添加一个类mouse_over。然后,当检测到mouse_over时,它会检查没有mouseleave个元素。需要setTimeout以允许mouseenter在mouseleave之前触发,并且可能需要进一步调整以消除竞争条件

Working Fiddle

$('.myDiv, .myDiv1').mouseenter(function () {
    $(this).addClass('mouse_over')
})
$('.myDiv, .myDiv1').mouseleave(function () {
    $this = $(this)
    timeoutId = setTimeout(function () {
        $this.removeClass('mouse_over')
        if ($('.mouse_over').length == 0) {
            console.log('not_in_either');
        }
    }, 1);
});

答案 1 :(得分:0)

作为变体 - 将类设置为例如当鼠标离开时“悬停”到div,并在mouseleave时将其删除。

然后创建函数,检查elementA和elementB没有“hovered”类,如果两者都是true - 做任何事情。将此函数绑定到elementA和elementB mouseleave事件。

答案 2 :(得分:0)

我已经更新了你的演示它应该按下按钮点击你可以根据你的要求改变。

here是演示

$('.myDiv').mouseleave(function(){ console.log('out'); });
         $('input').click(function(){
              alert('a');
              $('.myDiv').trigger('mouseleave');
         });