<html>

<head>

<script type="text/javascript" src="/jquery/jquery.js"></script>

<script type="text/javascript">

$(document).ready(function(){

  $("button").live("click",function(){

    $("p").slideToggle();

  });

});

</script>

</head>

<body>

<p>这是一个段落。</p>

<button>请点击这里</button>

</body>

</html>

但是随着jQuery的版本升级，自从jQuery 1.9及其以上已经无法使用live了，那么没有办法了吗，不是的，对于jQuery1.9版本及其以上可以使用on，其效果等同于live。下面的on的使用方法

<script>

$(document).on("click", ".waiting-save", function () {

　　$(this).html('@T("Saving...")')

　　$(this).attr("disabled", "");

});

</script>

整个代码例子为：

<!DOCTYPE html>

<html>

<head>

    <title></title>

    <meta charset="utf-8"/>

</head>

<body>

<div>

   <form action=" " method=" " >

    <div class="list">

        <div class="addList">

            分部：

            <select>

                <option>分部</option>

                <option>分部1</option>

                <option>分部2</option>

            </select>

            数量：<input type="text" value="123"/>

            <!-- <span class="add">添加</span>  -->
             <input type="button" value="添加"  class="add"/>

        </div>

    </div>

    </form>

</div>

</body>

<script type="text/javascript" src="./js/jquery-2.1.4.min.js"></script>

<script type="text/javascript">

    $(function(){

        //全局变量i

          i=0;

          $(".add").click(function() {

              $(".list").append(function(){

                    return '<div class="delList'+i+'"> 分部： <select><option>分部</option><option>分部1</option><option>分部2</option></select> 数量：<input type="text" value="123"/><input type="button" class="del" value="删除"/> </div>';

              });

              i++;

          });

         $(document).on("click", ".del", function () {

            $(this).parent().remove();

         });

    })

</script>

</html>
注意：
1.button的问题
<input type="button" value="添加"  class="add"/> 
这句不能使用 <button class="add">添加</button>
使用button标签的时候，添加的 delList DIV会闪一下，闪了之后就会消失了，不能显示在页面上。
2.input标签闭合问题。
在编辑页面的时候，要记得标签要闭合，不闭合的话，会出现问题。

参考网址：
http://so.xiaohuihui.net/?a=url&k=6c98d343&u=aHR0cDovL3d3dy5idWJ1a28uY29tL2luZm9kZXRhaWwtNTcwMjgyLmh0bWw=&t=6Kej5Yaz5L2@55SoalF1ZXJ56YeH55SoYXBwZW5k5re75Yqg55qE5YWD57Sg5LqL5Lu25peg5pWI55qE5pa55rOVIA==&s=anF1ZXJ5IGFwcGVuZCDml6DmlYg=
												


											
解决使用jQuery采用append添加的元素事件无效的方法的更多相关文章
	

    
								
  1. JavaScript采用append添加的元素错误
		
    1.错误叙述性说明 于IE览器上: Uncaught HierarchyRequestError:Failed to excute 'appendChild' on 'Node':The new ch ...
    
		
    2. 
						
  2. 用jquery添加新元素很容易，面对jquery append 动态添加的元素事件on 不起作用我们该如何解决呢？
		
    用jquery添加新元素很容易,面对jquery append 动态添加的元素事件on 不起作用我们该如何解决呢?on方法中要先找到原选择器(如例.info),再找到动态添加的选择器(如列.delet ...
    
		
    3. 
						
  3. [转]jquery append 动态添加的元素事件on 不起作用的解决方案
		
    用jquery添加新元素很容易,面对jquery append 动态添加的元素事件on 不起作用我们该如何解决呢?on方法中要先找到原选择器(如例.info),再找到动态添加的选择器(如列.delet ...
    
		
    4. 
						
  4. jquery append 动态添加的元素事件on 不起作用的解决方案
		
    用jquery添加新元素很容易,面对jquery append 动态添加的元素事件on 不起作用我们该如何解决呢?on方法中要先找到原选择器(如例.info),再找到动态添加的选择器(如列.delet ...
    
		
    5. 
						
  5. jq append添加的元素click获取不到的解决方法
		
    移动端手机ios网页,apppend添加html class名用 on()方法没效果 解决方案:在html里面给需要点击的元素加一个onclick="javascript:void(0)&q ...
    
		
    6. 
						
  6. jQuery对 动态添加 的元素 绑定事件（on()的用法）
		
    从jQuery 版本 1.7 起,on() 方法是向被选元素添加事件处理程序的(官方推荐)首选方法. 当浏览器下载完一个页面的时候就开始渲染(翻译)HTML标签,然后执行css.js代码,在执行js代 ...
    
		
    7. 
						
  7. WEB前端技巧之JQuery为动态添加的元素绑定事件.md
		
      jquery 为动态添加的元素绑定事件 如果直接写click函数的话,只能把事件绑定在已经存在的元素上,不能绑定在动态添加的元素上 可以用delegate来实现 .delegate( select ...
    
		
    8. 
						
  8. jQuery获取动态添加的元素，live和on的区别
		
    今天给大家说一下如果用jQuery获取动态添加的元素,通常如果你在网页上利用jQuery添加一个元素,那么用平常的jQuery获取元素的方法无效的获取不到的.可以用以下的方法获取动态元素!假设我们现在 ...
    
		
    9. 
						
  9. jquery append 动态添加的元素事件on 不起作用问题的解决
		
    on方法中要先找到原选择器(如例.info),再找到动态添加的选择器(如列.delete). 不多说看成功代码(注意加粗加色): <!DOCTYPE html PUBLIC "-//W ...
    
		
    10. 
		

	


随机推荐
	

    
									
  1. NFine - 全球领先的快速开发平台    Dapper     Chloe
			
    http://www.nfine.cn/ 技术交流群:549652099 出处:http://www.cnblogs.com/huanglin/ 分享一个轻型ORM--Dapper选用理由 Chloe
    
			
    2. 
						
  2. CGRectGet系列
			
    CGRectGetHeight返回label本身的高度 CGRectGetMinY返回label顶部的坐标 CGRectGetMaxY 返回label底部的坐标 CGRectGetMinX 返回lab ...
    
			
    3. 
						
  3. 怎样新建Oracle数据库
			
    新建Oracle数据库三种方法:1.通过运行Oracle Database Configuration Assistant 创建配置或删除数据库(也可在命令行下输入dbca):2.用命令行的方式建立数 ...
    
			
    4. 
						
  4. RMAN笔记小结
			
    首先感谢junsansi和leshani两位大师的文笔:我可是好好看了很多遍:这两位哦:我跟你们说:对rman的解说那是相当精彩:文章形如流水,通俗易懂:内容那是入木三分...;好了我也不多说了,反正 ...
    
			
    5. 
						
  5. java用freemarker导出数据到word（含多图片）
			
    一.制作word模版 新建word文档,按照需要设置好字体等各种格式:这里为了显得整齐使用了无边框的表格. 将word文档另存为xml文件(注意不是word xml文档,我吃了这家伙的大亏了) 然后用 ...
    
			
    6. 
						
  6. JavaScript中创建类，赋值给ajax中的data参数
			
    缘由:因为要给根据是否选中checkbox来动态增加ajax中data的属性(ajax的data属性格式的几种方法,参考http://www.jb51.net/article/46676.htm) d ...
    
			
    7. 
						
  7. [转]iOS学习之UINavigationController详解与使用(一)添加UIBarButtonItem
			
    转载地址:http://blog.csdn.net/totogo2010/article/details/7681879 1.UINavigationController导航控制器如何使用 UINav ...
    
			
    8. 
						
  8. java关于StringBuffer和StringBuilder写入文件的效率问题
			
    StringBuffer在存储字符的时候,是有上限的,一旦达到上线就会出错,自己在项目中遇到一个从数据库中查询数据,然后写入到本地文件中 ,数据量大概有30万条,此时的效率十分的低.下面是大致的模拟该 ...
    
			
    9. 
						
  9. hdu4932 Miaomiao's Geometry
			
    这是一道搜索题,我们很容易得到目标值的上下界,然后就只能枚举了. 就是将x轴上的点排序之后从左到右依次考察每个点,每个点要么在线段的左端点,要么在线段的右端点. 点编号从0到n-1,从编号为1的点开始 ...
    
			
    10. 
						
  10. 浅谈算法和数据结构: 七 二叉查找树 八 平衡查找树之2-3树 九 平衡查找树之红黑树 十 平衡查找树之B树
			
    http://www.cnblogs.com/yangecnu/p/Introduce-Binary-Search-Tree.html 前文介绍了符号表的两种实现,无序链表和有序数组,无序链表在插入的 ...
    
			
    11.