用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. Mysql经典sql语句大全

    DDL-数据定义语言(Create,Alter,Drop,DECLARE) DML-数据操纵语言(Select,Delete,Update,Insert) DCL-数据控制语言(GRANT,REVOK ...

  2. GBDT

    一.决策树分类 决策树分为两大类,分类树和回归树 分类树用于分类标签值,如晴天/阴天/雾/雨.用户性别.网页是否是垃圾页面 回归树用于预测实数值,如明天的温度.用户的年龄 两者的区别: 分类树的结果不 ...

  3. Spark进阶之路-日志服务器的配置

    Spark进阶之路-日志服务器的配置 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 如果你还在纠结如果配置Spark独立模式(Standalone)集群,可以参考我之前分享的笔记: ...

  4. 函数和常用模块【day06】:re模块(九)

    本节内容 1.简述 2.常用的正则表达式符号 3.常用匹配方法 4.常用方法 5.反斜杠的困扰 6.其他匹配模式 7.总结 一.简述 就其本质而言,正则表达式(或 RE)是一种小型的.高度专业化的编程 ...

  5. H5 localStorage sessionStorage

    localStorage 用于长久保存整个网站的数据,没有过期时间,除非手动去除. sessionStorage 会话存储,临时存储,当用户关闭浏览器窗口后,数据被删除. 共同方法 以 localSt ...

  6. 通过 LPeg 介绍解析表达式语法(Parsing Expression Grammars)

    通过 LPeg 介绍解析表达式语法(Parsing Expression Grammars) 译者: FreeBlues 修订版本: 1.00 最新链接: http://www.cnblogs.com ...

  7. Linux 命令详解(六)Linux 守护进程的启动方法

    Linux 守护进程的启动方法 http://www.ruanyifeng.com/blog/2016/02/linux-daemon.html

  8. JAVA实现二叉树(简易版--实现了二叉树的各种遍历)

    1,个人感觉二叉树的实现主要还是如何构造一颗二叉树.构造二叉树函数的设计方法多种多样,本例采用 addNode 方法实现.以下程序通过定义内部类来表示二叉树的结点,然后再实现了二叉树这种数据结构的一些 ...

  9. 旅行商问题(TSP)、最长路径问题与哈密尔顿回路之间的联系(归约)

    一,旅行商问题与H回路的联系(H回路 定义为 哈密尔顿回路) 旅行商问题是希望售货员恰好访问每个城市一次,最终回到起始城市所用的费用最低,也即判断图中是否存在一个费用至多为K的回路.(K相当于图中顶点 ...

  10. node.js 笔记

    教程总结笔记: 学习网站:http://www.runoob.com/nodejs/nodejs-install-setup.html Node.js 中文网及安装文件下载: http://nodej ...