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 相关文章推荐
永不消失的title提示代码
Feb 15 Javascript
Date对象格式化函数代码
Jul 17 Javascript
JavaScript基础语法让人疑惑的地方小结
May 23 Javascript
jQuery中delegate与on的用法与区别示例介绍
Dec 20 Javascript
js实现class样式的修改、添加及删除的方法
Jan 20 Javascript
VUE实现日历组件功能
Mar 13 Javascript
微信小程序实现点击按钮修改view标签背景颜色功能示例【附demo源码下载】
Dec 06 Javascript
angularjs 动态从后台获取下拉框的值方法
Aug 13 Javascript
JS集合set类的实现与使用方法示例
Feb 01 Javascript
js实现全选反选不选功能代码详解
Apr 24 Javascript
Vue页面刷新记住页面状态的实现
Dec 27 Javascript
JavaScript基于面向对象实现的无缝滚动轮播示例
Jan 17 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中header的用法详解
2013/06/07 PHP
PHP对接微信公众平台消息接口开发流程教程
2014/03/25 PHP
php 实现进制相互转换
2016/04/07 PHP
GreyBox技术总结(转)
2010/11/23 Javascript
使用jQuery UI的tooltip函数修饰title属性的气泡悬浮框
2013/06/24 Javascript
Javascript基础 函数“重载” 详细介绍
2013/10/25 Javascript
jquery数组封装使用方法分享(jquery数组遍历)
2014/03/25 Javascript
基于js与flash实现的网站flv视频播放插件代码
2014/10/14 Javascript
jQuery中next方法用法实例
2015/04/24 Javascript
JQuery中Text方法用法实例分析
2015/05/18 Javascript
JS实现控制文本框的内容
2016/07/10 Javascript
React 实现拖拽功能的示例代码
2019/01/06 Javascript
JS猜数字游戏实例讲解
2020/06/30 Javascript
mustache.js实现首页元件动态渲染的示例代码
2020/12/28 Javascript
Django1.7+python 2.78+pycharm配置mysql数据库教程
2014/11/18 Python
简单介绍Python中的len()函数的使用
2015/04/07 Python
Python的Flask框架中实现分页功能的教程
2015/04/20 Python
浅谈python中字典append 到list 后值的改变问题
2018/05/04 Python
使用python实现快速搭建简易的FTP服务器
2018/09/12 Python
win10下python3.5.2和tensorflow安装环境搭建教程
2018/09/19 Python
Django 中间键和上下文处理器的使用
2019/03/17 Python
Python利用WMI实现ping命令的例子
2019/08/14 Python
Python栈的实现方法示例【列表、单链表】
2020/02/22 Python
Python判断三段线能否构成三角形的代码
2020/04/12 Python
在python3.64中安装pyinstaller库的方法步骤
2020/06/02 Python
全面解析HTML5中的标准属性与自定义属性
2016/02/18 HTML / CSS
HTML5在线预览PDF的示例代码
2017/09/14 HTML / CSS
Boutique 1美国:阿联酋奢侈时尚零售商
2017/10/16 全球购物
澳大利亚百货商店中销量第一的商务衬衫品牌:Van Heusen
2018/07/26 全球购物
小米旗下精品生活电商平台:小米有品
2018/12/18 全球购物
护士感人事迹
2014/05/01 职场文书
个人担保书范文
2014/05/20 职场文书
银行员工考核评语
2014/12/31 职场文书
2015年客服工作总结范文
2015/04/02 职场文书
2019财务毕业实习报告
2019/06/27 职场文书
MySQL 原理与优化之原数据锁的应用
2022/08/14 MySQL