Question

我有两个用于鼠标悬停功能的处理程序，我想知道有什么区别以及如何以最有效的方式使用每个处理程序。

代码块一：

$('.test div').mouseover(function() {
                    $(this).stop().animate({
                        left: '100px'
                    }, 550);
});

代码块二：

$('.test').delegate('div', 'mouseover', function() {
                    $(this).stop().animate({
                        left: '100px'
                    }, 550);
                });

提前致谢：）

Answer 1

.delegate()为每个mouseover元素添加一个 .test事件处理程序，而不是每个.test div匹配，并且适用于将来{{1}在您调用<div>的{{1}}元素中添加了元素。

如果每个.test中没有多个.delegate()元素，并且它们没有动态更改（例如通过AJAX添加），则可以直接绑定。在其他情况下，它们是动态变化的，或只有很多，使用<div>，因为启动成本更便宜，泡沫/选择器成本微不足道。

Answer 2

这就是文档中的所有内容：http://api.jquery.com/delegate/

首先，委托类似于“实时”，因为它将适用于将来创建的对象。所以你应该把它与它进行比较：


    $('.test div').live('mouseover', function() {
                        $(this).stop().animate({
                            left: '100px'
                        }, 550);

现在，区别在于使用委托，它将应用于在调用命令后创建的div，但不适用于之后创建的.test。如果您使用$（

使用live（）或delegate（）会有性能成本，所以如果你不需要它，你应该坚持只适用于已经创建的元素的处理程序。

Answer 3

代表附加一个或多个事件对于匹配的所有元素选择器，现在或将来，基于在一组特定的根元素上。

取自jQuery API

Answer 4

据我所知，委托是允许你修改Event.target。因此，假设您点击了元素，您可以重新定位到DIV。

代表们如何有用？

4 个答案: