问题： 当我们在网页加载完成后， 使用 JQuery 给页面动态增加增加节点时， 会发现新增节点无法触发点击事件
处理： 使用 live() 或 on() 方法给新增节点添加点击事件
！！！注意： live() 方法在 jQuery 版本 1.7 中被废弃，在版本 1.9 中被移除。
所以 JQuery 1.9 后的版本请使用 on() 方法给元素添加点击事件
举个例子， Html示例：
<body>
<div id="demo">
<span class="demo1">demo-1</span>
<span class="demo1">demo-2</span>
<span class="demo1">demo-3</span>
</div>
</body>
<script type="text/javascript">
$("#demo").click(function(){
//动态在 div 的末尾追加一个新元素
$("#demo").append('<span class="demo1">demo-4</span>');
});
</script>使用 live() 方法：
live() 方法为被选元素添加一个或多个事件处理程序，并规定当这些事件发生时运行的函数。
通过 live() 方法添加的事件处理程序适用于匹配选择器的当前及未来的元素（比如由脚本创建的新元素）。
提示：如需移除事件处理程序，请使用 die() 方法。
用法：$("#parent").live('click', 'child', function(){})
$('.demo1').live('click', function(){
alert('给当前及未来的元素添加点击事件');
});使用 on() 方法：推荐使用该方法
on() 方法在被选元素及子元素上添加一个或多个事件处理程序。
自 jQuery 版本 1.7 起，on() 方法是 bind()、live() 和 delegate() 方法的新的替代品。该方法给 API 带来很多便利，推荐使 用该方法，它简化了 jQuery 代码库。
注意：使用 on() 方法添加的事件处理程序适用于当前及未来的元素（比如由脚本创建的新元素）。
提示：如需移除事件处理程序，请使用 off() 方法。
提示：如需添加只运行一次的事件然后移除，请使用 one() 方法。
用法：$("#parent").on('click', 'child', function(){})
$("#demo").on('click','.demol',function(){
alert('OK')
});测试， 点击事件可以被触发
扫一扫
3267
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
