的JavaScript鼠标悬停儿童冒泡

Ive得到了如下HTML设置：的JavaScript鼠标悬停儿童冒泡

<div id="div1"> 
<div id="content1">blaat</div> 
<div id="content1">blaat2</div> 
</div>

它的样式，所以你不能没有徘徊其他2周的div一个悬停DIV1。现在我有div1上的鼠标。
问题是，当我从content1移动到content2时，触发了div1.mouseout，因为它们的鼠标正在冒泡。
和事件的目标，currentTarget当前或relatedTarget属性是从来没有DIV1，因为它从来没有直接徘徊...
我一直在寻找疯了，但我只能找到谁是相反问题的文章和解决方案我需要的。这似乎微不足道，但我不能得到它的工作...
div1的mouseout应该只有当鼠标离开div1时触发。

可能性之一是设置在鼠标的一些数据输入和鼠标离开，但我相信这应该工作开箱即用，因为它仅仅是一个鼠标移出...

编辑：

bar.mouseleave(function(e) { 
       if ($(e.currentTarget).attr('id') == bar.attr('id')) { 
        bar.css('top', '-'+contentOuterHeight+'px'); 
        $('#floatable-bar #floatable-bar-tabs span').removeClass('active'); 
       } 
      });

改变了鼠标移出到鼠标离开和代码工作...

来源

2010-03-15 NDM

安置自己的jQuery代码，努力帮助离不开它。 – 2010-03-15 12:51:13

使用mouseleave事件，而不是或mouseout对于这一点，它处理你的具体问题。 See here for details

从上区别文档：

MouseLeave事件从鼠标移开区别它处理事件冒泡的方式。如果在此示例中使用了mouseout，那么当鼠标指针移出Inner元素时，处理程序将被触发。这通常是不受欢迎的行为。另一方面，mouseleave事件只在鼠标离开绑定元素时触发其处理程序，而不是后代。所以在这个例子中，当鼠标离开Outer元素时触发处理程序，而不是Inner元素。

示例标记：

<div id="outer"> 
    Outer 
    <div id="inner"> 
    Inner 
    </div> 
</div>

来源

2010-03-15 12:53:09

Thx，mouseleave确实解决了这个问题，并根据需要填写了event.currentTarget，并在代码中更新了我的帖子，以防any1感兴趣 – NDM 2010-03-15 13:09:51

即使使用jQuery，浏览器对mouseenter和mouseleave的支持如何？我担心旧版浏览器.... – 2012-06-12 21:31:09

的hover方法有两个参数，首先为在小鼠和第二对小鼠进行。

$('your_div').hover(function(){ 
    // your code here. 
}, function(){// any mouse out code here})

来源

2010-03-15 12:53:00 Sarfraz

他希望鼠标离开以正确触发......您只使用mousenter参数，不知道这有何帮助？ – 2010-03-15 12:56:09

@nick：我刚刚举了一个他应该知道的例子。谢谢 – Sarfraz 2010-03-15 13:06:13

的JavaScript鼠标悬停儿童冒泡

回答

相关问题