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


Posted in Javascript onMarch 09, 2015

本文实例讲述了jQuery给动态添加的元素绑定事件的方法。分享给大家供大家参考。具体分析如下:

jquery中绑定事件一般使用bind,或者click,但是这只能是对已经加载好的元素定义事件,那些后来添加插入的元素则需要另行绑定。在1.7版本以前使用live。但是在1.8版本以后推荐使用on。这里介绍jQuery中如何给动态添加的元素绑定事件
在实际开发中会遇到要给动态生成的html元素绑定触发事件的情况

例如

<div id="testdiv">
  <ul></ul>
</div>

需要给<ul>里面动态添加的<li>标签添加click事件
 
jquery 1.7版以前使用live动态绑定事件

$("#testdiv ul li").live("click",function(){
});

jquery 1.7版以后使用on动态绑定事件

$("#testdiv ul").on("click","li", function() {
     //do something here
 });

希望本文所述对大家的jQuery程序设计有所帮助。

Javascript 相关文章推荐
Grid得到选择行数据的方法总结
Jan 17 Javascript
关于jquery css的使用介绍
Apr 18 Javascript
jQuery点击自身以外地方关闭弹出层的简单实例
Dec 24 Javascript
js使用心得分享
Jan 13 Javascript
JavaScript实现鼠标点击后层展开效果的方法
May 13 Javascript
JQuery控制Radio选中方法分析
May 29 Javascript
javascript 数组的正态分布排序的问题
Jul 31 Javascript
原生js获取元素样式的简单方法
Aug 06 Javascript
在vue中使用公共过滤器filter的方法
Jun 26 Javascript
详解一次Vue低版本安卓白屏问题的解决过程
May 30 Javascript
微信小程序以ssm做后台开发的实现示例
Apr 08 Javascript
VUE 实现element upload上传图片到阿里云
Aug 12 Javascript
jquery滚动加载数据的方法
Mar 09 #Javascript
jQuery晃动层特效实现方法
Mar 09 #Javascript
javascript中hasOwnProperty() 方法使用指南
Mar 09 #Javascript
jQuery设置和移除文本框默认值的方法
Mar 09 #Javascript
jQuery读取XML文件内容的方法
Mar 09 #Javascript
JQuery动态添加和删除表格行的方法
Mar 09 #Javascript
Python脚本后台运行的几种方式
Mar 09 #Javascript
You might like
关于在php.ini中添加extension=php_mysqli.dll指令的说明
2007/06/14 PHP
提高PHP编程效率 引入缓存机制提升性能
2010/02/15 PHP
基于php权限分配的实现代码
2013/04/28 PHP
php 发送带附件邮件示例
2014/01/23 PHP
学习php设计模式 php实现桥梁模式(bridge)
2015/12/07 PHP
php操作redis常见方法示例【key与value操作】
2020/04/14 PHP
理解JavaScript变量作用域更轻松
2009/10/25 Javascript
js Function类型
2011/12/04 Javascript
window.location.href中url中数据量太大时的解决方法
2013/12/23 Javascript
jquery如何根据值设置默认的选中项
2014/03/17 Javascript
js点击button按钮跳转到另一个新页面
2014/10/10 Javascript
js解决select下拉选不中问题
2014/10/14 Javascript
jQuery获取table行数并输出单元格内容的实现方法
2016/06/30 Javascript
如何使用bootstrap框架 bootstrap入门必看!
2017/04/13 Javascript
jQuery实现锚点向下平滑滚动特效示例
2017/08/29 jQuery
JS使用tween.js动画库实现轮播图并且有切换功能
2018/07/17 Javascript
vue项目在线上服务器访问失败原因分析
2020/08/14 Javascript
详解vue组件之间的通信
2020/08/30 Javascript
利用Python中的输入和输出功能进行读取和写入的教程
2015/04/14 Python
Python保存MongoDB上的文件到本地的方法
2016/03/16 Python
python算法演练_One Rule 算法(详解)
2017/05/17 Python
flask框架使用orm连接数据库的方法示例
2018/07/16 Python
Django中FilePathField字段的用法
2020/05/21 Python
德国著名廉价网上药店:Shop-Apotheke
2017/07/23 全球购物
开水果连锁店创业计划书
2013/12/29 职场文书
《故都的秋》教学反思
2014/04/15 职场文书
人事行政经理岗位职责
2014/06/18 职场文书
中学教师师德师风演讲稿
2014/08/22 职场文书
意外伤害赔偿协议书
2014/09/16 职场文书
2014年领导班子专项整治整改方案
2014/09/28 职场文书
求职简历自我评价范文
2015/03/10 职场文书
中标通知书
2015/04/17 职场文书
被告代理词范文
2015/05/25 职场文书
童年读书笔记
2015/06/26 职场文书
志愿者工作心得体会
2016/01/15 职场文书
PHP 对接美团大众点评团购券(门票)的开发步骤
2021/04/03 PHP