jquery live問題

Question

我有一個使用jquery和大量mouseover/mouseout效果的網站。到目前爲止，我使用jQuery的.bind（）方法，但如果您有> 1000個事件處理程序，則會大大減慢瀏覽器的速度。所以，我想移動到使用.live或.delegate。

我門戶網站的一部分是聊天區。用戶可以設置聊天消息，然後將顯示在一個簡單的表格中。有一項功能，如果您將鼠標移動到聊天消息上，則會出現一個垃圾箱，允許您刪除該消息（如果是由您或您是主持人）。

垃圾箱與聊天消息位於同一個表單元格中。

問題：使用.bind（）它像魅力一樣工作。這是舊的代碼：

function CreateChatMessageContextMenu(ctrl, messageID, message, sender) { 

var a = document.createElement("a"); 
a.href = "javascript:RemoveChatMessage(" + messageID + ");" 
a.id = 'aDeleteChatMessage' + messageID; 
a.style.display = 'none'; 
var img = document.createElement("span"); 
img.className = "sprite-common messages-image sprite-common-btnDelete"; 
a.appendChild(img); 
ctrl.appendChild(a); 


$(ctrl) 
    .bind('mouseover', function(event) { $('#aDeleteChatMessage' + messageID).show() }) 
    .bind('mouseout', function(event) { $('#aDeleteChatMessage' + messageID).hide() }); 
return; 

}

'CTRL' 是參照本發明的表格單元格。

現在，使用.live（）垃圾桶也會出現，但閃爍很多，當我將鼠標移到垃圾桶上時，它正在消失或不活動。我感覺有更多的事件被拋出或什麼東西。在垃圾桶上移動時，似乎會出現「鼠標移出」現象，但是thrashbin位於表格內部，因此不應觸發鼠標移出。新代碼如下。

$(document).ready 
{ 
$('.jDeleteableChatMessage').live('mouseover mouseout', function(event) { 
    var linkID = '#aDelete' + event.target.id; 
    if (event.type == 'mouseover') { 
     $(linkID).show(); 
    } else { 
     $(linkID).hide(); 
    } 
    return false; 
}); 
} 

function CreateChatMessageContextMenu(ctrl, messageID, message, sender) { 
if (!UserIsModerator && (UserLogin != sender)) return; 
ctrl.id = 'ChatMessage' + messageID; 
var deleteString = 'Diese Chatnachricht löschen'; 
if (UserLang == '1') deleteString = 'Delete this chat message'; 

var a = document.createElement("a"); 
a.href = "javascript:RemoveChatMessage(" + messageID + ");" 
a.id = 'aDeleteChatMessage' + messageID; 
a.style.display = 'none'; 
var img = document.createElement("span"); 
img.className = "sprite-common messages-image sprite-common-btnDelete"; 
img.alt = deleteString; 
img.title = deleteString; 
a.appendChild(img); 
ctrl.appendChild(a); 

$(ctrl).addClass('jDeleteableChatMessage'); 

} 

我添加了一個類來告訴jQuery哪個聊天單元有垃圾桶，哪個沒有垃圾桶。我還爲表格單元添加了一個ID，後者用於確定關聯的垃圾箱。是的，這是笨拙的數據傳遞給事件方法。 而且，自然，有一個document.ready函數可以初始化.live（）方法。

那麼，我的錯誤在哪裏？

Answer 1

我會使用jQuery事件來防止你的閃爍，他們在這裏提供更多的智能觸發：mouseenter和mouseleave。請記住，hover現在也支持.live()。

您可以使用hover（mouseenter/mouseleave）是這樣的：

$('.jDeleteableChatMessage').live('hover', function(event) { 
    $('#aDelete' + this.id).toggle(); 
    return false; 
});