以一个小例子来简单说明下情况

1
2
3
4
5
6
7
8
 <script src="jquery-1.11.0.min.js"></script>
<input type="button" value="点击我" id="k" />
 
<script>
$('#k').click(function() {
    alert("kkkkk");
})
</script>

如果直接在页面上这么写,可以弹出"kkkkk"。然而当input元素是ajax动态加载进来并输出到页面的,这时弹出窗就失效了,相当于click事件没有被绑定到id为k的元素上。

这时script里可以这样写:

1
2
3
$(document).on('click','#k',function() {
    alert("kkkkk");
})

一般使用live()或者delegate()替换on()也能达到预期效果。但注意我举例的时候使用的是jquery-1.11.0版本,从 jquery1.9版本开始就去除掉live(),听说是性能问题。所以高版本的jquery可以用delegate()和on()。

jquery 绑定动态元素的更多相关文章

  1. jQuery绑定动态元素的点击事件无效

    之前就一直受这个问题的困扰,在写ajax加载数据的时候发现,后面追加进来的demo节点元素,失去了之前的点击事件.为什么点击事件失效,我们该怎么去解决呢?那么,我们通过下面的示例简单说明. 示例如下: ...

  2. jQuery on()绑定动态元素出现的问题小结

    jQuery on()方法是官方推荐的绑定事件的一个方法.使用 on() 方法可以给将来动态创建的动态元素绑定指定的事件,通过本文给大家介绍jQuery on()绑定动态元素出现的问题小结,需要的朋友 ...

  3. jQuery on()方法绑定动态元素的点击事件无响应的解决办法

    $('#check_all').on('click' , function(){ alert(1); }); $("#yujinlist").append(html); count ...

  4. jQuery on()方法绑定动态元素的点击事件

    之前就一直受这个问题的困扰,在jQuery1.7版本之后添加了on方法,之前就了解过,其优越性高于live(),bind(),delegate()等方法,在此之前项目中想用这个来测试结果发现,居然动态 ...

  5. jQuery on()方法绑定动态元素的点击事件无效

    之前就一直受这个问题的困扰,在jQuery1.7版本之后添加了on方法,之前就了解过,其优越性高于live(),bind(),delegate()等方法,在此之前项目中想用这个来测试结果发现,居然动态 ...

  6. jQuery on()方法绑定动态元素的点击事件实例代码浅析

    之前就一直受这个问题的困扰,在jQuery1.7版本之后添加了on方法,之前就了解过,其优越性高于live(),bind(),delegate()等方法,在此之前项目中想用这个来测试结果发现,居然动态 ...

  7. Jquery 在动态元素上绑定事件

    弄了很久却没有弄出来,感觉没有错,但是动态元素上的事件根本就不响应,代码如下: <input type="button" id="btnyes" valu ...

  8. jq的绑定动态元素

    在项目中经常会遇到需要在页面中插入动态元素的情况,比如页面中有一个按钮: <div id="btn">确定</div> 点击按钮时在body中插入一段div ...

  9. jQuery给动态添加的元素绑定事件的方法

    我们在开发过程会遇到无法给动态元素添加绑定事件,解决方案如下: 例如 <div id="testdiv">   <ul></ul> </d ...

随机推荐

  1. facl笔记

    文件系统访问列表:tom:    tom, tom基本组jerry: other:r-- chown FACL:Filesystem Access Control List利用文件扩展保存额外的访问控 ...

  2. python之路-随笔 python处理excel文件

    小罗问我怎么从excel中读取数据,然后我百了一番,做下记录 以下代码来源于:http://www.cnblogs.com/lhj588/archive/2012/01/06/2314181.html ...

  3. PC--CSS技巧

    1.图片不存在的时候,显示一个默认图片 <img src=”01.jpg” onerror=”this.src=’02.jpg'” /> 2.CSS强制图片自适应大小 img {width ...

  4. unity3d 建树篇

    今天碰到有人问这个问题,然后我经过一番折腾,找到了方法.例如以下: 有学过Unity3d的同学生都知道我们在对地形拖拉树木等表层时,其树木在我们实例执行中,它们都是能够任其他物体穿过. 这是为什么.相 ...

  5. 在后台操作标记的runat="server"的html标签

    价格: <input id="tbPrice" type="text" runat="server" /> HtmlInputT ...

  6. HTML与CSS入门——第三章 理解HTML和XHTML的关系

    知识点: 1.以HTML创建一个简单网页的方法 2.包含每个网页必须有的所有HTML标签的方法 3.用段落和换行组织页面的方法 4.用标题组织内容的方法 5.HTML.XML.XHTML和HTML5之 ...

  7. C# 文件操作(一)

    1.说明: 写入文件内容,如果文件中有内容,则进行追加,目录是程序集下的目录 public static void WriteLog(string value) { try { //目录是程序集下的D ...

  8. 鼠标滚轮(mousewheel)和DOMMouseScroll事件

    IE6.0首先实现了mousewheel事件.此后,Opera.Chrome和Safari也都实现了这个事件.当用户通过鼠标滚轮与页面交互.在垂直方向上滚动页面时(无论向下还是向上),就会触发mous ...

  9. orcl 行转列的存储过程

    CREATE or replace PROCEDURE sp_fixWage AUTHID CURRENT_USER as --此处需要注意的 authid current_user 这个属性  详细 ...

  10. POJ 1269 - Intersecting Lines 直线与直线相交

    题意:    判断直线间位置关系: 相交,平行,重合 include <iostream> #include <cstdio> using namespace std; str ...