當目標div有子輸入字段時，jquery mouseenter/mouseleave錯誤

我有兩個可排序的列表，一個是嵌套的，鼠標在嵌套可排序列表的li元素上輸入效果。我的問題是，當用戶通過列表在輸入字段的子元素上快速移動鼠標時，mouseenter和mouseleave函數被調用的不一致。當目標div有子輸入字段時，jquery mouseenter/mouseleave錯誤

下面是發生了什麼的示例，您必須將窗格拖到列表中，然後將3-4個文本框項目拖動到窗格中才能看到問題。你可以看到右上角的2個數字跟蹤鼠標的進出。注意到目前爲止，我只在firefox 3.5.7中測試過我的網站。這個問題似乎被固定在Firefox 3.6版，但我需要這個的Firefox 3.x的所有先前版本上工作

example

我的jQuery 1.4.1代碼：

這裏是的mouseenter和鼠標離開功能：

$(".pane > li").live("mouseover", function(){ 
$("#in").html(in1); 
$(this).children(".test").stop().animate({opacity: 1},400); 
in1++; 
}); 

$(".pane > li").live("mouseout", function(){ 
$("#out").html(out1); 
$(this).children(".test").stop().animate({opacity: 0},400); 
out1++; 
});

我已經嘗試指定的mouseenter和鼠標離開功能，而無需使用活（）時，我稱之爲動態地將li元素到頁面的功能。但是，問題仍然存在，您可以看到在螢火蟲調試器中出現錯誤。也許它與Firefox中的relatedTarget有關。感謝您的幫助。

來源

2010-02-10 Ag565

哇，看起來很酷。無論如何，也許你可以做到這一點，以便當「mouseenter」觸發一件事情時，它會在所有其他的代碼上運行與「mouseout」相對應的代碼。由於它們不能重疊，所以它看起來像是可行的。

來源

2010-02-10 04:36:30 Pointy

嗯，它並沒有真正發揮出那麼好。它變得複雜，因爲我想添加另一個mouseenter（）事件到一個已經被鼠標放置的元素的子元素。 – Ag565 2010-02-10 21:17:11

我發現問題的絕妙解決方案是在輸入字段上絕對放置一個透明的div，並在點擊時減少div的z-index。同時我專注於輸入字段，因此div對用戶來說實際上是不可見的。如果有人有任何建議，我仍然會更喜歡更優雅的修復。

來源

2010-02-10 21:15:46 Ag565

當目標div有子輸入字段時，jquery mouseenter/mouseleave錯誤

回答

相關問題