2010-01-28 61 views
3

我在與mosueenter /鼠標離開事件只是Firefox的一個問題...問題與jQuery的MouseEnter /鼠標離開在Firefox

http://www.screencast.com/users/StanleyGoldman/folders/Jing/media/be3572de-9c72-4e2a-8ead-6d29b0764709

<HTML> 
    <HEAD> 
     <script type="text/javascript" src="http://code.jquery.com/jquery-1.4.js"></script> 
     <script> 
      $(document).ready(function() { 
       $("#theDiv").mouseenter(function() { 
        $("#output").append('mouseenter<br>'); 
       }); 
       $("#theDiv").mouseleave(function() { 
        $("#output").append('mouseleave<br>'); 
       }); 
      }); 

     </script> 
    </HEAD> 
    <BODY> 

    <div id="theDiv" style="position:relative; height: 300px; width:300px; background-color:Black;"> 
     <input type="text" style="position:absolute; top: 40px;" /> 

     <div style="position:absolute; top:100px; height:100px; width:100px; background-color:Red; overflow:auto;"> 
     <p>Content</p> 
     <p>Content</p> 
     <p>Content</p> 
     <p>Content</p> 
     <p>Content</p> 
     <p>Content</p> 
     <p>Content</p> 
     <p>Content</p> 
     <p>Content</p> 
     <p>Content</p> 
     <p>Content</p> 
     <p>Content</p> 
     </div> 
    </div> 

    <div id="output"></div> 

    </BODY> 
</HTML> 

我只想知道,當鼠標有離開包含DIV。 但是,如果您將鼠標移動到文本框上的速度非常快,或者將鼠標移動到div的滾動條上,則會觸發事件。

- 編輯 -

$("#theDiv").hover(function() { 
    $("#output").append('hoverin<br>'); 
}, function() { 
    $("#output").append('hoverout<br>'); 
}); 

我試圖用懸停以下。 它似乎只在Firefox中遭遇同樣的問題。

回答

2

此行爲與Firefox 3.6中已修復的firefox bug有關。 jQuery嘗試使用withinElement函數(通過jQuery源代碼進行搜索)處理這個錯誤,但該解決方案並不完美。

2

我幾乎總是發現,如果您打算在鼠標進入和離開某個元素時執行操作,則最好使用hover()方法或hoverIntent()插件而不是單獨的mouseenter/mouseleave處理程序。這些似乎都可以處理可能的鼠標移動事件的範圍,而不是僅僅映射到mouseenter/mouseleave。

+0

我只是試圖懸停。同樣的問題。 – 2010-01-28 22:12:14

+1

顯然該錯誤只出現在Firefox 3.5.7中,該錯誤在Firefox 3.6中不可重現。 – 2010-01-28 22:24:24

+0

我在FF 3.5.8中也有這種錯誤行爲。 – MyGGaN 2010-04-08 22:21:36

相關問題