【jquery】 在异步加载的元素上绑定事件

最近由于工做关系又从新回归到了jquery的怀抱，发现不少jquery的一些细节处理的部分都忘记了。这里记录一下最近在作项目时频繁遇到的一个问题：给异步加载的元素添加事件绑定。

问题发生的前提是项目前端开发使用了jquery 和 artTemplate技术，其中常常要经过artTemplate的template.compile()方法来实现像是向下滚动鼠标动态加载后续分页的内容并显示在页面上这样的效果。

在jquery官网上关于事件绑定和事件委托的4个方法中有这样的介绍：

live()：jQuery1.7以后弃用
bind(): 动态添加的元素没法使用该方法绑定事件
delegate():jQuery1.7以后被on()取代
on()： jQuery1.7以后引入，支持事件绑定的所有功能

从这里能够看出咱们正常状况下使用的就是bind()或者on()了，而bind()没法实如今动态添加的元素上绑定事件，那么咱们平时使用频率很高的$('xx').click(function(){...})也是不适用的。因此要实如今异步加载的元素上添加事件绑定须要使用on()方法。

通常来讲能够直接绑定在document对象上，如$(document).on('click','xx',function(){...})这样的语法。$(...)中的元素须要是真正绑定的元素'xx'的父级或者body上。当事件直接发生在绑定的元素上时，该程序不会被调用。

另外，我在另外一个项目也是用了像这样的直接把事件委托在document对象上来实现事件绑定，可是没有效果，而后我换了一个更近一点的父元素就行了。。。若是你也遇到这样的问题能够试试改为绑定在比较接近的父元素上。

以上纯属我的意见，但愿你们发现有问题的能够给我指点，也欢迎你们来互相交流。