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. (转)解决点击a标签返回页面顶部的问题

    本文转载至http://www.cnblogs.com/chenluomenggongzi/p/5950670.html 1 <!DOCTYPE html> 2 <html lang ...

  2. 题解 P1888 【三角函数】

    堆排序万岁! 小金羊又来水题了 #include <iostream> #include <queue> using namespace std; priority_queue ...

  3. Redis安装配置及使用详解

    1. 简介-两个程序通信,除了socket就是文件了,但是通过磁盘效率太低了,之前的RabbitMQ只是实现了消息的传递,现在要是实现数据的共享(一份数据,可供多人查阅),可以通过缓存实现,一个中间商 ...

  4. CF662C Binary Table 枚举 FWT

    题面 洛谷题面 (虽然洛谷最近有点慢) 题解 观察到行列的数据范围相差悬殊,而且行的数量仅有20,完全可以支持枚举,因此我们考虑枚举哪些行会翻转. 对于第i列,我们将它代表的01串提取出来,表示为\( ...

  5. 【BZOJ3122】随机数生成器(BSGS,数论)

    [BZOJ3122]随机数生成器(BSGS,数论) 题面 BZOJ 洛谷 题解 考虑一下递推式 发现一定可以写成一个 \(X_{i+1}=(X_1+c)*a^i-c\)的形式 直接暴力解一下 \(X_ ...

  6. nginx服务器去掉url中的index.php 和 配置path_info

    隐藏index.php server { listen 80; server_name yourdomain.com; root /home/yourdomain/www/; index index. ...

  7. 【bzoj3669】魔法森林

    Portal-->bzoj3669 Solution ​  愉悦智力康复ing ​​  这题的话有两个比较关键的地方 ​​  首先是答案肯定是原图的某个生成树上的一条路径,那么我们考虑怎么来找这 ...

  8. Android开发-eclipse+phonegap(Cordova)环境搭建

    搭建步骤: 一.安装java [官网下载].eclipse+ADT+Android SDK [点我下载x86(android-22)] | [adt-bundle-windows-x86_64-201 ...

  9. (转)IOS 的一些资源汇总

      UI界面类项目: Panoramagl —— 720全景展示 Panorama viewer library for iPhone, iPad and iPod touch MBProgressH ...

  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 ...