jquery 通过 live() 方法附加的事件处理程序适用于匹配选择器的当前及未来的元素(比如由脚本创建的新元素)

$("ul").append("<li class='name'>名称</li>");

【错误】 然后通过下面的方式, 这样是不能获取的 :

$(".name").click(function (){
   alert("获取到append后的节点");
})

【正确】 正确的方法是:

$(".name").live("click", function() {
  alert("获取到了"); 
});

jquery 1.7+之后用on代替live,on() 方法在被选元素及子元素上添加一个或多个事件处理程序

<div id="one"></div>
$('#one').append("<p id='two'>test1</p>");
append后结果:
$('#one').append("<p id='two'>test1</p>");

【错误】 直接用下面的方式, 不会弹出窗口的 :

$("#two").on("click",function(data){
    alert(data);
});

【正确】 改成下面的方式:

$("body").on("click","#two",function(data){
    alert(data);
});

jquery 通过 live() 方法附加的事件处理程序适用于匹配选择器的当前及未来的元素(比如由脚本创建的新元素)的更多相关文章

  1. jquery使用on()方法绑定的事件被执行多次的问题

    jQuery用on()方法绑定了事件之后,在代码执行过程中,可能会遇到事件被多次执行的情况. 本来以为是事件冒泡的问题,后来发现是on()方法的特性引起的问题. 简单还原一下问题的场景 这里简单还原一 ...

  2. jQuery的live()方法对hover事件的处理示例

    hover([over,]out) 一个模仿悬停事件(鼠标移动到一个对象上面及移出这个对象)的方法 当鼠标移动到一个匹配的元素上面时,会触发指定的第一个函数. 当鼠标移出这个元素时,会触发指定的第二个 ...

  3. jQuery用unbind方法去掉hover事件及其他方法介绍

    近日项目开发十分的繁忙,其中一个需求是实现响应式导航.(响应式的问题我们在css相关的博客中再交流) 大家都知道导航是需要下来菜单效果的,必然就会用到 jQuery的 hover() 方法.若是导航放 ...

  4. 使用jQuery中trigger()方法自动触发事件

    一.常用事件 在页面加载完成时  自动触发input的点击事件,在移动端可以实现自动弹出输入法,获得焦点 $("input").trigger("click") ...

  5. jQuery 的 live() 方法对 hover 事件的处理

    因为hover不是标准的事件,因此无法直接使用live进行处理,故使用以下方法代替,效果一样 <script type="text/javascript"> $(&qu ...

  6. jquery 动态生成html后click事件不触发原因

    转自:http://www.iam3y.com/html/560.html 最近在做一个项目的时候,遇到动态加载微博内容,然后点击“展开评论”后获取该微博的所有评论.这里使用了动态加载的<spa ...

  7. 对jquery新增加的class绑定事件

    当页面加载时,就会注册所有的事件,后面通过jquery新增的内容(<div class="item"></div>),再对新增的添加事件$(".i ...

  8. jquery动态生成html代码绑定事件

    今天工作中需要在页面动态生成html代码,但发现新生成的代码的click事件失效了(非动态生成的代码已经绑定了click事件),于是在网上找了很多解决办法,很多都比较复杂,且使用的jquery都比较老 ...

  9. 通过jQuery给<li>绑定点击事件

    背景:有个需求需要js中实现li标签的事件绑定,li通过在ajax请求中动态添加,按照常理,使用jQuery,可以使用以下方法绑定点击事件: $(function(){  commonAjaxCall ...

随机推荐

  1. 利用JavaFX访问MySQL数据库

    1. 创建数据库表 create table Course( courseId char(5), subjectId char(4) not null, courseNumber integer, t ...

  2. wp开发(二)--获取用户篇

    本文从个人开发者的角度来谈如何让wp应用获得尽可能多的用户.当然前提是你的app有一定的竞争性,如果不具备竞争力,那再多的用户下载也是白扯,所以最关键的还是要保证app的质量. 一. 程序图标 千万不 ...

  3. WebGL画一个10px大小的点

    WebGL程序在屏幕上同时使用HTML和javascript来创建和显示三维图形.WebGL中新引入的<canvas>元素标签,它定义了网页上的绘图区域. 由于<canvas> ...

  4. HDU1232——畅通工程

    #include<stdio.h> ]; int find(int x) //查找根节点 { int r=x; while (pre[r]!=r) //返回根节点 r r=pre[r]; ...

  5. 51nod1222 最小公倍数计数 莫比乌斯反演 数学

    求$\sum_{i = 1}^{n} \sum_{j = 1}^{i} [lcm(i, j) \le n]$因为这样不好求,我们改成求$\sum_{i = 1}^{n} \sum_{j = 1}^{n ...

  6. 并发时-修改Linux系统下的最大文件描述符限制

    通常我们通过终端连接到linux系统后执行ulimit -n 命令可以看到本次登录的session其文件描述符的限制,如下: $ulimit -n1024 当然可以通过ulimit -SHn 1024 ...

  7. openresty--centos7下开发环境安装

    1. 安装依赖的软件包 yum install readline-devel pcre-devel openssl-devel gcc 2. 安装openresty -- 1. 下载openresty ...

  8. jQuery 前端实现手机验证码

    html <input id="phone" type="text" name="phone"> <input id=&q ...

  9. 2016-2017 ACM-ICPC East Central North America Regional Contest (ECNA 2016) F 区间dp

    Problem F Removal GameBobby Roberts is totally bored in his algorithms class, so he’s developed a li ...

  10. Codeforces 894.C Marco and GCD Sequence

    C. Marco and GCD Sequence time limit per test 1 second memory limit per test 256 megabytes input sta ...