的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鼠標懸停兒童冒泡

回答

相關問題