代码之家 › 专栏 › 技术社区 › Barrie Reader

代理有何用处?

jquery

Barrie Reader · 技术社区 · 15 年前

我有两个mouseover函数的处理程序,我想知道有什么不同,以及如何以最有效的方式使用每一个。

代码块1:

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

代码块二:

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

提前谢谢:)

4 回复 | 直到 15 年前

Nick Craver 15 年前

.delegate() 附加一 mouseover 每个事件处理程序 .test 元素,而不是每个元素 .test div 匹配,为未来工作 <div> 在这些元素中添加的元素 .测试 您调用的元素 .delegate() 打开。

如果你只有几个 <分区> 每个元素中的元素 .测试 而且它们不会动态变化(例如通过AJAX添加),您可以直接绑定。在其他情况下,如果它们是动态变化的,或者只是有很多,请使用 .delegate() 因为启动成本是 许多的 更便宜,而且泡沫/选择器的成本微乎其微。

erwan 15 年前

所有这些都在医生里: http://api.jquery.com/delegate/

首先,委托类似于“live”,因为它将应用于将来创建的对象。所以你应该把它和:


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

现在,不同的是,对于delegate,它将应用于在调用命令之后创建的div,而不是在调用命令之后创建的.test。如果你使用live on$(

使用live()或delegate()在性能上是有代价的,因此如果不需要它,您应该坚持使用只应用于已创建元素的处理程序。