今天遇到一个问题，由Jquery动态去生成一段html元素后，这些新生成的元素绑定的事件不起作用，后来查阅解决，废话不说，上代码，以下代码目的是点击button按钮，移除span区域。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title> New Document </title>
<meta name="Generator" content="EditPlus">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<script type="text/javascript" src='http://code.jquery.com/jquery-1.9.1.js'></script>
</head>
<body>
<input type='button' id='creates' value='test'>
<div id='aDiv'>
<span>
<li><input type='button' name='a' value='1'></li>
<li>xxx</li>
</span>
<span>
<li><input type='button' name='a' value='2'></li>
<li>xxx</li>
</span>
</div>
<script type="text/javascript">
$(function(){
/*$('input[name=a]').each(function(){
$(this).click(function(){
$(this).parent().parent().remove();
});
});*/
$('input[name=a]').click(function(){
$(this).parent().parent().remove();
});
$('#creates').click(function(){
$('#aDiv').append('<span><li><input type=button name=a value=1></li><li>xxx</li></span>');
});
//注释以下代码，动态生成的Html元素点击button时不能够被移除
$('div').delegate('input[name=a]','click',function(){$(this).parent().parent().remove()});
})
</script>
</body>
</html>
总结：
1. click或者是...bind('click',function(){...});，click是bind('click',...)的简化形式，是JQuery扫描文档找出所有的$(‘input[name=a]’)元素，并把函数绑定到每个元素的click事件上，表明是现有页面上存在的元素，动态生成的元素不包括在内。
2.delegate方法，代理或者说是委托，实现原理是事件的冒泡，在指定的祖先元素中注册事件（delegate在特定元素上），元素事件触发，传播到这个元素然后进行筛选。可以在祖先元素中绑定事件，比如上面的div是祖先元素，而新生成的元素都是div的子元素，所以动态生成的元素的事件就可以绑定了。
delegate官网介绍：Attach a handler to one or more events for all elements that match the selector, now or in the future, based on a specific set of root elements.
官网网址：http://api.jquery.com/delegate/
相关推荐
本文实例讲述了jQuery给动态添加的元素绑定事件的方法。分享给大家供大家参考。具体分析如下： jquery中绑定事件一般使用bind，或者click，但是这只能是对已经加载好的元素定义事件，那些后来添加插入的元素则需要...
本文实例讲述了jQuery动态生成的元素绑定事件操作。分享给大家供大家参考，具体如下： 这段时间在写代码的时候遇到一个问题，通过append()添加的节点，点击事件不起作用。当时我百思不得其解，各种找错都没找到错误...
用jquery的时候你会发现，页面渲染后动态生成的dom，在生成之前的代码是没办法取到相应对象的，必须重新获取.但是vue基于数据绑定的特性让它能生成的时候直接绑定数据。 html: <input type=text v-model...
在实际开发中会遇到要给动态生成的html元素绑定触发事件的情况： <ul></ul> 假设我们要给ul动态添加的绑定click事件形成如下结果 <li name=apple>apple <li name=pear>pear [removed] function test...
本文实例讲述了AngularJS实现给动态生成的元素绑定事件的方法。分享给大家供大家参考，具体如下： 1 . 我们知道在jQuery中，动态生成一个元素，如果要在动态生成元素的同时，动态绑定事件，可以通过live/on方法（在...
之前做项目都是直接用jquery的bind绑定事件，不过当时都不是动态生成dom元素，而是已经页面中原本存在的dom元素进行事件绑定，最近在测试给动态生成的dom绑定事件的时候发现事件失效，于是就测试了一下： ...
jQuery 使用on绑定动态生成的元素时，不能直接用该对象操作，而是选择其非动态生成的父节点然后再找到本身才能达到效果。大家看看源码就知道了。生成的按钮基数项on方法点击无效live方法有效。 比如页面上有下边两个...
jQuery 使用on绑定动态生成的元素时，不能直接用该对象操作，而是选择其非动态生成的父节点然后再找到本身才能达到效果。大家看看源码就知道了。
对于动态生成的元素，bind绑定的事件 也无法触发，需要通过jQuery提供的另外一个方法 .live() 这个方法是基本是的 .bind() 方法的一个变体。使用 .bind() 时，选择器匹配的元素会附加一个事件处理函数，而以后再添加...
// 绑定高度并获得当前隐藏keys（获得当前事件的下一个元素） /** * 显示状态和模块 */ /** * 隐藏状态和模块 */ /** * 动态创建层并添加显示内容 改分页 */ /** * DWR 提交 */ /** * 分页函数 ...
以前我都是讲这个插件使用在静态HTML元素中的，今天为动态生成的元素绑定的时候发现不能用了。 常规的用法是这样的： 代码如下: <a>www.jb51.net</a> 代码如下: $(document).ready(function(){
主要介绍了jQuery实现动态生成表格并为行绑定单击变色动作的方法,涉及jQuery页面元素遍历与事件动态响应相关操作技巧,需要的朋友可以参考下
用jQuery的append()方法动态添加了一段html代码之后，发现在为新添加的元素绑定click事件时无法获取该新元素。 二、解决方法 度娘推荐的方法基本是用live()方法 live()的官方定义和用法: live() 方法为...
live方法其实是bind方法的变种，其基本功能就同bind方法的功能是一样的，都是为一个元素绑定某个事件，但是bind方法只能给当前存在的元素绑定事件，对于事后采用JS等方式新生成的元素无效，而live方法则正好弥补了...
jQuery使用on()绑定动态生成元素的事件无效的问题 jQuery的on()方法可以绑定动态生成元素的事件，但是在实际使用时发现无效。如下HTML： <a>123 使用如下方式，对静态元素有效，但是绑定动态生成的a元素的事件时...
jQuery live()方法是给所有匹配的元素附加一个事件处理函数，即使这个元素是以后通过append,prepend,after等事件生成后的内容也依然有效。 这个方法可以看做是 .bind() 方法的一个变体。使用 .bind() 时，选择器匹配...
jQuery on()方法是官方推荐的绑定事件的一个方法。使用 on() 方法可以给将来动态创建的动态元素绑定指定的事件，例如append等。 之前使用 on 的时候一直是 $().on('click','function(){ }') 之后发现有些时候一直...