什么是动态绑定?

动态绑定是指动态添加的DOM节点或者html元素,他们最开始时运行的时候是不存在的。如果要给这些动态加入的节点增加事件,就必须要用jquery的on方法来绑定事件。

$('.content dd').click(function(){  //普通事件方法
        alert($(this).val());
    });
<div class='content'>
<dl>
<dd>博客园1</dd>
<dd>博客园1</dd>
<dd>博客园3</dd><!--<dd>博客园4</dd>-->    假设这个|博客园4|是动态添加的 那么前面的三个博客园点击都是有效果的 最后一个是无效的  js部分应用下面的写法</dl>    </div>
$('.content').on('click','dd',function(){    //动态事件绑定  为页面所有的dd添加一个事件 包括新增的节点
        alert($(this).val());
    });

//动态事件绑定说明:首先要获取到要添加动态事件的父节点,并且这个父节点是刚开始就存在的(源代码里面就有的)。

jquery动态绑定事件的更多相关文章

  1. jquery - 动态绑定事件

    举个例子: html页面 <div><button type="button" class="test">测试</button&g ...

  2. $("#XXX").click()和$("#YYY").on("click","指定的元素",function(){});的区别(jQuery动态绑定事件)

    //绑定 下一页 的点击事件 $("a[aria-label='Next']").click(function(){ $("a[aria-label='Previous' ...

  3. Jquery中$("").事件()和$("").on("事件","指定的元素",function(){});的区别(jQuery动态绑定事件)

    这个是在学习时不懂的问题,记录下来方便查看 转至https://www.cnblogs.com/mr-wuxiansheng/p/7136864.html //绑定 下一页 的点击事件 $(" ...

  4. jQuery动态绑定事件(左右移动)

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  5. jquery json遍历和动态绑定事件

    <div id='tmpselectorList' style='border: 1px solid grey;max-height: 150px;position:absolute;text- ...

  6. jQuery的动态绑定事件的应用

    注意:bind()的事件绑定是只对当前页面选中的元素有效.如果你想对动态创建的元素bind()事件,是没有办法达到效果的 <script src="jquery-1.11.2.min. ...

  7. [转]使用 jQuery Mobile 与 HTML5 开发 Web App —— jQuery Mobile 事件详解

    在前文<使用 jQuery Mobile 与 HTML5 开发 Web App —— jQuery Mobile 默认配置与事件基础>中,Kayo 对 jQuery Mobile 事件的基 ...

  8. jquery 动态绑定bind()及模拟鼠标点击A链接

    近来自觉前端有小小进步,幸而记之. 1.两个 css class 紧挨在一起 则在html元素中,要同时拥有这两个class,才能起作用 .block.db{ background-image:url ...

  9. jQuery的事件绑定与触发 - 学习笔记

    jQuery的事件绑定与触发 事件绑定 自动触发事件 常用的鼠标事件 事件冒泡和默认行为 事件冒泡 默认行为 获得当前鼠标的位置和按键 jQuery的事件绑定与触发 事件绑定 基本绑定 $(eleme ...

随机推荐

  1. WIDGET和鼠标特效的DEMO

    原创WIDGET和鼠标特效的DEMO, 键盘1 平移Widget键盘2 旋转Widget键盘3 缩放Widget DEMO中,实现对BOX的旋转缩放位移 下载地址: http://pan.baidu. ...

  2. C#创建数字证书并导出为pfx,并使用pfx进行非对称加解密

    本文源程序下载:http://download.csdn.net/source/2444494 我的项目当中,考虑到安全性,需要为每个客户端分发一个数字证书,同时使用数字证书中的公私钥来进行数据的加解 ...

  3. Java主流Web Service框架介绍:CXF和Axis2

    CXF和Axis2是目前java平台上最主流的两个框架,虽然两个项目都隶属ASF,但却是基于不同思想和风格实现的,因此也各有所长.   CXF:http://cxf.apache.org/ 是由过去的 ...

  4. org.dom4j.DocumentException: unknown protocol: d Nested exception: unknown

    最近用dom4j写了一个修改XML文件的小例子,抛出了如下异常: org.dom4j.DocumentException: unknown protocol: d Nested exception: ...

  5. M2Mqtt is a MQTT client available for all .Net platform

    Introduction M2Mqtt is a MQTT client available for all .Net platform (.Net Framework, .Net Compact F ...

  6. 基于Mongodb进行分布式数据存储

    http://blog.csdn.net/daizhj/article/details/5868360 注:本文是研究Mongodb分布式数据存储的副产品,通过本文的相关步骤可以将一个大表中的数据分布 ...

  7. PHPCMS增加投票选项代码

    <script src="jquery-1.10.1.js"></script> <tr> <th width="20%&quo ...

  8. com.esotericsoftware.kryo.kryoexception java.util.ConcurentModificationException

    近期 有网友看我的"整合Kafka到Spark Streaming--代码演示样例和挑战"文章, 讲 kafka对象 放到 pool 并通过broadcast广播出去: 然后 在开 ...

  9. android 如何连真机测试

    1. 设置android手机为USB调试模式.步骤: menu---> 设置 ---> 应用程序 ---> 开发 , 选择[USB调试] 2. 用USB连接手机和电脑,并确保成功.步 ...

  10. Speculative Execution in Hadoop

    来自:http://blog.csdn.net/macyang/article/details/7880671 所谓的推测执行,就是当所有task都开始运行之后,Job Tracker会统计所有任务的 ...