`on`和`live`或`bind`有什么区别？
在jQuery v1.7中增加了一个新的方法。 从文档：
.on（）方法将事件处理程序附加到jQuery对象中当前选定的一组元素。 从jQuery 1.7开始，.on（）方法提供了附加事件处理程序所需的全部function。
live和bind什么区别？
on()是试图将jQuery的大部分事件绑定函数合并为一个。 这有助于整理live与delegate的低效率。 在将来的jQuery版本中，这些方法将被删除，只有one将被删除。
例子：
// Using live() $(".mySelector").live("click", fn); // Equivalent `on` (there isn't an exact equivalent, but with good reason) $(document).on("click", ".mySelector", fn);
// Using bind() $(".mySelector").bind("click", fn); // Equivalent `on` $(".mySelector").on("click", fn);
// Using delegate() $(document.body).delegate(".mySelector", "click", fn); // Equivalent `on` $(document.body).on("click", ".mySelector", fn);
在内部，jQuery将所有这些方法和速记事件处理程序设置器映射到on()方法，进一步表明您应该从现在开始忽略这些方法，并使用on ：
bind: function( types, data, fn ) { return this.on( types, null, data, fn ); }, live: function( types, data, fn ) { jQuery( this.context ).on( types, this.selector, data, fn ); return this; }, delegate: function( selector, types, data, fn ) { return this.on( types, selector, data, fn ); },
请参阅https://github.com/jquery/jquery/blob/1.7/src/event.js#L965 。
在性质上与delegate非常接近。 那么为什么不使用委托？ 这是因为不是一个人来。 有off事件， one只创build一个事件，只执行一次。 这是一个新的事件的“包”。
live的主要问题是，它附加到“窗口”，迫使页面结构（dom）内部的元素上的点击事件（或其他事件），以“冒泡”到页面的顶部以find事件处理程序愿意处理它。 在每个级别，所有的事件处理程序必须被检查，这可以加快速度，如果你做深度重叠（ <body><div><div><div><div><table><table><tbody><tr><td><div><div><div><ul><li><button> etc etc etc... ）
所以，像click一样， bind就像其他快捷方式事件绑定器直接附加到事件目标。 如果你有一个表，比如1000行和100列，每个100'000单元格都包含一个你想要处理的checkbox。 附加100000个事件处理程序将花费大量的时间在页面加载。 在表级别创build单个事件，并使用事件委托的效率提高了几个数量级。 事件目标将在事件执行时被检索。 “ this ”将是表格，但是“ event.target ”将会是您通常的clickfunction中的“ this ”。 现在好的事情是“ this ”将永远是事件的目标，而不是它所附的容器。
使用.on方法可以.live ， .delegate和.bind使用相同的函数，但仅使用.live() .live()是可能的（将事件委托给文档）。
jQuery("#example").bind( "click", fn ) = jQuery("#example").bind( "click", fn )
jQuery("#example").delegate( ".examples", "click", fn ) = jQuery("#example").delegate( ".examples", "click", fn ) jQuery( "#example" ).on( "click", ".examples", fn )
jQuery("#example").live( fn ) = jQuery( document ).on( "click", "#example", fn )
我可以直接从jQuery源代码确认：
bind: function( types, data, fn ) { return this.on( types, null, data, fn ); }, live: function( types, data, fn ) { jQuery( this.context ).on( types, this.selector, data, fn ); return this; }, delegate: function( selector, types, data, fn ) { return this.on( types, selector, data, fn ); },
jQuery（this.context）？ 在大多数情况下this.context === document
（在你改变这个问题之前，我的开头句子更有意义了，原来你会说“与live什么不同？”）
更像是delegate不是像live一样，它基本上是一个统一的bind和delegateforms（事实上，团队表示它的目的是“统一所有事件附加到文档的方式…” ） 。
live基本上是on整个文件on （或delegate ）。 从v1.7开始弃用 ，赞成使用on或delegate 。 outlook未来，我怀疑我们只会看到使用代码，而不是使用bind或delegate （或live ）…
所以在实践中，你可以：
-
使用像
bind：/* Old: */ $(".foo").bind("click", handler); /* New: */ $(".foo").on("click", handler); -
on类似的delegate（根源于给定元素的事件委托）上使用：/* Old: */ $("#container").delegate(".foo", "click", handler); /* New: */ $("#container").on("click", ".foo", handler); -
onlive使用（事件代表根植于文件中）：/* Old: */ $(".foo").live("click", handler); /* New: */ $(document).on("click", ".foo", handler);
live是.on（）的快捷方式
//from source http://code.jquery.com/jquery-1.7.js live: function( types, data, fn ) { jQuery( this.context ).on( types, this.selector, data, fn ); return this; }
此帖也许对你有用http://blog.jquery.com/2011/11/03/jquery-1-7-released/
基本用例没有一个。 这两条线在function上是一样的
$( '#element' ).bind( 'click', handler ); $( '#element' ).on( 'click', handler );
.on（）也可以做事件委托，是首选。
.bind（）现在实际上只是.on（）的别名。 这里是1.7.1中绑定函数的定义
bind: function( types, data, fn ) { return this.on( types, null, data, fn ); },
添加.on（）的想法是创build一个统一的事件API，而不是具有绑定事件的多个function; .on（）replace.bind（），.live（）和.delegate（）。
如果要获取与该元素关联的事件处理程序，应该注意一些事项 – 注意处理程序所连接的元素！
例如，如果您使用：
$('.mySelector').bind('click', fn);
你会得到事件处理程序使用：
$('.mySelector').data('events');
但是，如果你使用：
$('body').on('click', '.mySelector', fn);
你会得到事件处理程序使用：
$('body').data('events');
（在最后一种情况下，相关的事件对象将有selector =“。mySelector”）
