关于jQuery中click&live&on中的坑

关于jQuery中click&live&on中的坑

click()方法：

click()方法针对未创建的元素不起作用，譬如用js传入的元素，所以可以使用live()方法来操作未创建的元素属性

live()方法：

1 $("button").live("click",function(){
2   $("p").slideToggle();
3 });

该方法在1.9版本被弃用了。

根据jQuery的官方描述，live方法在1.7中已经不建议使用，在1.9中删除了这个方法。并建议在以后的代码中使用on方法来替代。
　　on方法可以接受三个参数：事件名、触发选择器、事件函数。

需要特别注意的是：on方法中间的这个触发选择器就是你将要添加的HTML元素的类名、id或者元素名，使用它就可以实现live的效果。

例如我的html文档中已经有了一个id为parent的div，我将要在这个div内部再动态添加一个class为son的span，然后我为这个span绑定一个事件，那么我需要这样写：

1 $('#parent').on('click','.son',function(){alert('test')});

关于on()方法：

这里也需要注意一下：on()方法，要绑定到父级或者 body

并且$(#list')父级元素必须是已经创建了的元素（就是不是通过js传入的元素）

'#list' 为目标操作元素的父级元素（必须是已经存在元素） |  'click' 为需要操作的元素属性  |  '.pure-u-3-4 a' 是目标操作元素

1 $('#list').on('click','.pure-u-3-4 a', function () {
2     alert("haha")
3 })

通过这样一番折腾，最终才能弹出haha 

posted on 2019-01-05 13:55 **勇敢的心 阅读( ...) 评论( ...) 编辑 收藏

转载于:https://www.cnblogs.com/lzc978/p/10224273.html