我找到了两篇关于新函数.on()的很棒的文章:jquery4u.com, elijahmanor.com。
是否有任何方法表明.bind()仍然比.on()更好?
例如,我有一个样例代码,看起来像这样:
$("#container").click( function( e ) {} )
你可以注意到,我只有一个项目检索的选择器和在我的情况下,<div>命名#容器已经存在时,我的页面被加载;没有动态添加。值得一提的是,我使用的是最新版本的jQuery: 1.7.2。
对于该示例,是否应该使用.on()而不是.bind(),即使我不使用.on()函数提供的其他功能?
这些代码段都执行完全相同的任务:
element.on('click', function () { ... });
element.bind('click', function () { ... });
element.click(function () { ... });
然而,它们与这些都有很大的不同,它们都执行相同的事情:
element.on('click', 'selector', function () { ... });
element.delegate('click', 'selector', function () { ... });
$('selector').live('click', function () { ... });
第二组事件处理程序使用事件委托,将用于动态添加的元素。使用委托的事件处理程序也具有更高的性能。第一组对动态添加的元素不起作用,而且性能更差。
jQuery的on()函数并没有引入任何以前不存在的新功能,它只是试图标准化jQuery中的事件处理(你不再需要在live、bind或delegate之间做出选择)。
这些代码段都执行完全相同的任务:
element.on('click', function () { ... });
element.bind('click', function () { ... });
element.click(function () { ... });
然而,它们与这些都有很大的不同,它们都执行相同的事情:
element.on('click', 'selector', function () { ... });
element.delegate('click', 'selector', function () { ... });
$('selector').live('click', function () { ... });
第二组事件处理程序使用事件委托,将用于动态添加的元素。使用委托的事件处理程序也具有更高的性能。第一组对动态添加的元素不起作用,而且性能更差。
jQuery的on()函数并没有引入任何以前不存在的新功能,它只是试图标准化jQuery中的事件处理(你不再需要在live、bind或delegate之间做出选择)。
如果您在源代码中查找$.fn。Bind你会发现它只是一个on的重写函数:
function (types, data, fn) {
return this.on(types, null, data, fn);
}
http://james.padolsey.com/jquery/ v = 1.7.2&fn = .fn.bind美元