使用 jQuery 1.3.2 进行事件委托

Question

我现在一直在使用 jQuery 1.3.2，而且我才刚刚开始了解一般的事件委托。但我似乎无法让任何类型的事件委托来处理此代码。我有一个带有“聊天”类的 ul，当将鼠标悬停在其中一个 li 上时，应该创建一个新的跨度，然后滑出，然后在鼠标离开 li 时滑回。

此代码有效，但我想使用事件委托：

$('ul.chat li').hover(
    function() {
        $(this).append($('<span class="join">Join Conversation</span>'));
        setTimeout(function() {
            $('.join').animate({'width': '150px'}, 400);
        },500);
    },
    function() {
        $('.join').animate({'width': '0px'}, 200, function(){
            $(this).remove();                                             
        }); 
    }
);

有人可以告诉我如何通过事件委托实现相同的结果吗？ 谢谢。

Answer 1

更新：您似乎并不希望为添加的项目进行事件委托，但更多的是因为您将使用非常大的结果集。

在 Google 上快速搜索（“事件委托 jquery 1.3.2”）得出 这个。

---

您可以通过 jQuery.live() 事件获得“事件委托” 。

您必须将其分成两个绑定，如下所示：

$('ul.chat li').live('mouseover',
    function() {
        $(this).append($('<span class="join">Join Conversation</span>'));
        setTimeout(function() {
            $('.join').animate({'width': '150px'}, 400);
        },500);
    }
).live('mouseout',
    function() {
        $('.join').animate({'width': '0px'}, 200, function(){
            $(this).remove();                                             
        }); 
    }
);