遇到的问题:动态生成的内容,事件绑定会出错。
例子:http://snowinmay.net/jqm/dom-learn2.html
1.绑定事件对动态生成的新元素无效。

问题描述:
bind事件绑定后只对dom中存在的元素有效,但是很多时候我们会对dom元素进行添加,后添加进来的元素bind事件是监测不到的。
解决方法:

  • 在每一个动态生成的地方都在次绑定一下事件
  • 把bind改用live,因为live是实时监测的
  • 把bind改用delegate,因为delegate是实时监测的
  • 在jq1.9版本后好像没有了live,改用了on
2.绑定事件多次执行。

问题描述:
绑定事件的时候,初始化的时候绑定一次,生成新的元素后又绑定一次,这样会造成事件执行多次。
解决方法:

  • 在绑定前先解绑事件:unbind().bind()
  • 先判断哪些元素是新添加的,哪些元素是初始化加载的,然后分别来处理
涉及到的知识点:
    • dom元素操作
    • 动态生成的元素事件绑定的处理(bind,on,live,delegate)
    • appendto和append的用法

dom元素操作(动态事件绑定)的更多相关文章

  1. jQuery_02之元素操作及事件绑定

    1.操作元素之属性: ①attr读:$("selector").attr("属性名"):=>getAttribute("属性名"):改 ...

  2. jQuery之元素操作及事件绑定

    1.操作元素之属性: ①attr读:("selector").attr("属性名"):=>getAttribute("属性名"):改: ...

  3. jQuery学习笔记之DOM操作、事件绑定(2)

    jQuery学习笔记之DOM操作.事件绑定(2) --------------------学习目录------------------------ 4.DOM操作 5.事件绑定 源码地址: https ...

  4. jQuery插件 -- 动态事件绑定插件jquery.livequery.js

    http://blog.csdn.net/zzq58157383/article/details/7721974 动态事件绑定插件livequery, 可以利用它给相应的DOM元素注册事件或者触发回调 ...

  5. [HTML5]原生事件绑定和jquery动态事件绑定的区别

    原生事件绑定: <!-- 标签上绑定的事件是由window对象帮助调用,因此方法内的this其实是window对象 --> <label><input type=&quo ...

  6. jquery 动态事件绑定(0512)

    jquery动态事件绑定,父元素需为静态元素,(不能是动态生成): $("#parent").on("click","#child",fun ...

  7. 深度解析JQuery Dom元素操作技巧

    深度解析JQuery Dom元素操作技巧 DOM是一种与浏览器.平台.语言无关的接口,使用该接口可以轻松访问页面中所有的标准组件,这篇文章给大家介绍了JQuery dom元素操作方法,写的十分的全面细 ...

  8. event.target 属性返回哪个 DOM 元素触发了事件。

    <ul> <li>list <strong>item 1</strong></li> <li><span>list ...

  9. vue样式操作与事件绑定

    Vue笔记 1 Vue实例 (VM) var vm = new Vue({    el:'#app', //挂载元素        //数据    data: {        title:'值', ...

随机推荐

  1. MySQL 复习笔记

    本文内容 SQL 语句 创建数据库 创建数据表 数据完整性约束 四种基本字符类型说明 SQL 基本语句 类型转换函数 日期函数 数学函数 字符串函数 合并结果集 union CASE 函数用法 IF ...

  2. .NET 并行编程——数据并行

    本文内容 并行编程 数据并行 环境 计算 PI 矩阵相乘 把目录中的全部图片复制到另一个目录 列出指定目录中的所有文件,包括其子目录 最近,对多线程编程,并行编程,异步编程,这三个概念有点晕了,之前我 ...

  3. CentOS 7不能进入图形界面

    开机后发现CentOS 7不能进入图形界面,进入终端模式后运行startx命令也报错,不知道什么原因,后来运行了yum upgrade命令,升级以后就可以进入图形界面了,同时也升级了.

  4. C++ 获取程序编译时间

    一个简单的需求,就是需要程序判断当前系统的时间是不是在程序编译之后的,如果系统当前时间在编译之前,那说明这台机器的时间是不正确的,需要终止程序运行. 因为要在程序编译时候获取时间,如果每次编译前手动修 ...

  5. Hadoop2.2.0分布式安装配置详解[3/3]

    测试启动 按照下面的每一步执行,执行完一定要看输出的信息,注意warn或error或fatal的情况.因为这都是可能是问题出现的地方.出现一个问题,不解决,可能就会影响接下来的测试.这才是真正的工作量 ...

  6. IDEA使用笔记(七)——编辑器最大个数的设置

    我想一定有许多人和我一样在使用IDEA的时候,打开了许多的编辑器选项卡,但是打开的数量是有限的,我们想打开更多的页面,并且希望控制当再次达到大限的时候能关闭那些我们最久没有看的文件! 好吧!看下面的配 ...

  7. 管理 Oracle Cluster Registry(OCR)

    oracle的clusterware包含两个重要组件:OCR(包含本地组件OLR)和voting disks --OCR管理oracle clusterware和oracle rac数据库的配置信息 ...

  8. system函数遇到的问题

     这几天调程序(嵌入式linux),发现程序有时就莫名其妙的死掉,每次都定位在程序中不同的system()函数,直接在shell下输入system()函数中调用的命令也都一切正常.就没理这个bug,以 ...

  9. oracle本地编译问题

    oracle10.2: --将过程重新编译为本地编译方式,提示有编译错误,经查提示未设置plsql_native_library_dir 参数 SQL> alter procedure p_xx ...

  10. 【转载】C# Graphics类具体解释

    封装一个 GDI+ 画图图面. 此类不能被继承.System.Drawing 命名空间 名称 说明 Clip  获取或设置 Region.该对象限定此 Graphics 的画图区域. ClipBoun ...