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. Hive(四)hive函数与hive shell

    一.hive函数 1.hive内置函数 (1)内容较多,见< Hive 官方文档>            https://cwiki.apache.org/confluence/displ ...

  2. 在 Xamarin.Forms 实现密码输入EntryCell

    在 Xamarin.Forms 中,我们通常使用 TableView 来构建输入表单.Xamarin 为我们提供了 EntryCell 用于输入文本,但是其并不支持密码输入,即密码掩码.这里要对 En ...

  3. R-FCN:基于区域的全卷积网络来检测物体

    http://blog.csdn.net/shadow_guo/article/details/51767036 原文标题为“R-FCN: Object Detection via Region-ba ...

  4. 图像PNG格式介绍

    1 图像png格式简介 PNG是20世纪90年代中期开始开发的图像文件存储格式,其目的是企图替代GIF和TIFF文件格式,同时增加一些GIF文件格式所不具备的特性.流式网络图形格式(PortableN ...

  5. POJ1011 木棒(dfs+剪枝)

    问题重述: Description乔治拿来一组等长的木棒,将它们随机地砍断,使得每一节木棍的长度都不超过50个长度单位.然后他又想把这些木棍恢复到为裁截前的状态,但忘记了初始时有多少木棒以及木棒的初始 ...

  6. Codeforces Global Round 2 题解

    Codeforces Global Round 2 题目链接:https://codeforces.com/contest/1119 A. Ilya and a Colorful Walk 题意: 给 ...

  7. web系统中上下移动功能的实现

    其实上移下移的思想分几步: 核心思想:交换两个记录的位置字段的值. 问题:如何根据当前记录,找到前一个或者后一个的记录的位置. 第一:在java类属性定义一个position位置字段,不同的位置pos ...

  8. 使用cron命令配置定时任务(cron jobs)

    原文 http://www.cnblogs.com/end/archive/2012/02/21/2361741.html 开机就启动cron进程的设置命令:chkconfig --add crond ...

  9. nginx 前后分离,地址重写,url匹配中遇到的问题

    我遇到的问题: 前端用vue的路由做页面路由,后台用spring mvc做数据接口,但是遇到路由地址和接口地址无法区分的问题,导致nginx无法正确准发比如: 1)http://127.0.0.1/i ...

  10. Android Studio 打包自定义apk文件名

    使用Android Studio打包的时候,我们有时候需要自定义apk的文件名,在此记录一下. 在app的build.gradle中,根节点下使用关键词def声明一个全局变量,用于获取打包的时间,格式 ...