用jquery添加新元素很容易，面对jquery append 动态添加的元素事件on 不起作用我们该如何解决呢？on方法中要先找到原选择器（如例.info),再找到动态添加的选择器（如列.delete)。

代码：

 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

 <html>

 <head>

 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

 <title>测试</title>

 <script type="text/javascript"

 src="../resources/js/jquery-1.11.1.min.js"></script>

 <script type="text/javascript">

 $(function(){

 //动态添加

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

 console.log("进来了");

 $(".info").append('<div class="delete"><h3>单击我来删除我</h3></div>');

 });

  //对动态添加的元素添加事件-删除

 $(".info").on("click",".delete",function(){

 console.log("进来了Delete！");

 $(this).remove();

 });

  });

 </script>

  </head>

 <body>

  <h2 class='add'>单击我添加动态元素</h2>

  <div class="info"></div>

  </body>

 </html>

用jquery添加新元素很容易，面对jquery append 动态添加的元素事件on 不起作用我们该如何解决呢？的更多相关文章

  1. [转]jquery append 动态添加的元素事件on 不起作用的解决方案

    用jquery添加新元素很容易,面对jquery append 动态添加的元素事件on 不起作用我们该如何解决呢?on方法中要先找到原选择器(如例.info),再找到动态添加的选择器(如列.delet ...

  2. jquery append 动态添加的元素事件on 不起作用的解决方案

    用jquery添加新元素很容易,面对jquery append 动态添加的元素事件on 不起作用我们该如何解决呢?on方法中要先找到原选择器(如例.info),再找到动态添加的选择器(如列.delet ...

  3. jquery append 动态添加的元素绑定事件on

    用jquery添加新元素很容易,面对jquery append 动态添加的元素事件on 不起作用我们该如何解决呢?on方法中要先找到原选择器(如例.info),再找到动态添加的选择器(如列.delet ...

  4. jquery append 动态添加的元素事件on 不起作用问题的解决

    on方法中要先找到原选择器(如例.info),再找到动态添加的选择器(如列.delete). 不多说看成功代码(注意加粗加色): <!DOCTYPE html PUBLIC "-//W ...

  5. Javascript/Jquery操作数组，增删改查以及动态创建HTML元素

    <html> <head> <title> New Document </title> <script src="~/Scripts/j ...

  6. jquery给动态添加的dom元素绑定事件

    $('input').click(function () { //处理代码 }); 这只能是对已经加载好的元素定义事件,那些后来添加插入的元素则需要另行绑定,对于页面中动态添加的元素,在页面加载完成后 ...

  7. [转] JQuery UI Tabs 动态添加页签，并跳转到新页签

    [From] https://blog.csdn.net/zhangfeng2124/article/details/76672403 需求: 1.tabs默认只有一个页签,但是需要点击某按钮,动态添 ...

  8. 使用Fragment 实现动态UI 和 动态添加Fragment

    首先写好每个Fragment: 1.在第一个Fragment写一个按钮,使其加载下一个Fragment 布局: <LinearLayout xmlns:android="http:// ...

  9. 【原生js】js动态添加dom，如何绑定事件

    首先要明白浏览器在加载页面的时候是按顺序来加载的,这样以来就很清楚了,js动态添加dom以后,这些dom并没有绑定事件,这个时候最简单的一个办法就是:将绑定事件的方法封装到一个函数A中,在动态添加完d ...

随机推荐

  1. Sublime Text3—Project(项目管理)

    摘要 Project 可以理解为项目.工程或者站点,以下称项目.使用项目管理的好处是:不用将所有文件都放到同一个根目录,可以将相关但不同路径的文件组成一个Project,每个项目都是独立的,文件的状态 ...

  2. toogle

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  3. kubernetes下的Nginx加Tomcat三部曲之一：极速体验

    在生产环境中,常用到Nginx加Tomcat的部署方式,如下图: 从本章开始,我们来实战kubernetes下部署上述Nginx和Tomcat服务,并开发spring boot的web应用来验证环境, ...

  4. Jenkins插件获取git分支的方法

    1.旧版本的Jenkins可以使用Dynamic Choice Parameter插件: 使用方法: Jenkins--->dev-h5-server--->配置--->参数化构建过 ...

  5. 20190408 XStream解析List

    XStream解析List 使用的JavaBean 普通JavaBean public class Book { private String name; public Book() { } publ ...

  6. Scala进阶之路-idea下进行spark编程

    Scala进阶之路-idea下进行spark编程 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 1>.创建新模块并添加maven依赖 <?xml version=&qu ...

  7. GO语言的进阶之路-网络编程之socket

    GO语言的进阶之路-网络编程之socket 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.什么是socket; 在说socket之前,我们要对两个概念要有所了解,就是IP和端口 ...

  8. webserver apache 2.2.22-7/ apache webdav / redhat 6.3

    s 问题1:Failed to resolve server name for 10.24.41.161 (check DNS)   /   RedHat 6.3 64位系统 / apache htt ...

  9. python---ORM之SQLAlchemy（4）relationship多对多练习

    练习一:朋友 import sqlalchemy from sqlalchemy import create_engine from sqlalchemy import Column, String, ...

  10. Linux - iptable 限制 IP 访问端口

    iptable 设置iptables 限制特定IP 访问: -A INPUT -s 172.16.2.20 -p tcp -j ACCEPT-A INPUT -s -p tcp -j ACCEPT 设 ...