jquery的on()绑定无效的方式
on前面的元素也必须在页面加载的时候就存在于dom里面。动态的元素或者样式等,可以放在on的第二个参数里面
jQuery on()方法是官方推荐的绑定事件的一个方法。使用 on() 方法可以给将来动态创建的动态元素绑定指定的事件,例如append等。
|
1
2
3
|
<div id="test"><div class="evt">evt1</div></div> |
错误的用法,下面方法只为第一个class 为 evt 的div 绑定了click事件,使用append动态创建的div则没有绑定
|
1
2
3
4
5
|
<script>// 先绑定事件再添加div$('#test .evt').on('click', function() {alert($(this).text())});$('#test').append('<div class="evt">evt2</div>');</script> |
正确的用法如下:
|
1
2
3
4
|
<script>$('body').on('click', '#test .evt', function() {alert($(this).text())});$('#test').append('<div class="evt">evt2</div>');</script> |
checkbox单选设置 如果 <input name="ck" type="checkbox">是动态添加的则可以这样
$("#grid").on("click","input[name=ck]",function(){
$("input[name=ck]").not(this).prop("checked",false);
});
注:$(selector).on(event,childSelector,data,function,map)
jquery的on()绑定无效的方式的更多相关文章
- 关于Jquery的delegate绑定事件无效
今天在做一个页面,用的是easyui页面有很多的tabs,里面都放了iframe 需要在load事件动态调整iframe高度 发现始终无法使用delegate来绑定load事件. 纠结了一下午发现了问 ...
- jQuery绑定事件-多种方式实现
jQuery绑定事件-多种方式实现: <html> <head> <meta charset="utf-8" /> <script src ...
- jQuery on()方法绑定动态元素的点击事件无效
之前就一直受这个问题的困扰,在jQuery1.7版本之后添加了on方法,之前就了解过,其优越性高于live(),bind(),delegate()等方法,在此之前项目中想用这个来测试结果发现,居然动态 ...
- jQuery 新添加元素事件绑定无效
jQuery中事件绑定,大多使用on就足够了. 但是对于新添加的元素 on 的绑定事件 会不起作用. 因为 append 中的 节点是在整个文档加载之后才添加的,页面并不会为未来的元素初始化添加点击事 ...
- 解密jQuery事件核心 - 绑定设计(一)
说起jQuery的事件,不得不提一下Dean Edwards大神 addEvent库,很多流行的类库的基本思想从他那儿借来的 jQuery的事件处理机制吸取了JavaScript专家Dean Edwa ...
- Javascript事件模型系列(三)jQuery中的事件监听方式及异同点
作为全球最知名的js框架之一,jQuery的火热程度堪称无与伦比,简单易学的API再加丰富的插件,几乎是每个前端程序员的必修课.从读<锋利的jQuery>开始,到现在使用jQuery有一年 ...
- 通过XMLHttpRequest和jQuery实现ajax的几种方式
AJAX大家已经都知道了,是为了实现异步通讯,提高用户体验度,而将很多旧知识(XML,DOM,JavaScript,HTML,Jquery,Css……)重新融合的一个新的知识框架.而,XMLHttpR ...
- jQuery on()方法绑定动态元素的点击事件
之前就一直受这个问题的困扰,在jQuery1.7版本之后添加了on方法,之前就了解过,其优越性高于live(),bind(),delegate()等方法,在此之前项目中想用这个来测试结果发现,居然动态 ...
- jQuery的live绑定事件在mobile safari(iphone / ipad / ipod)上失效的解决方案
jQuery的live绑定为什么会在mobile safari上失效呢?其实可以追溯到jQuery里live的实现方式.live的实现方式实际上是通过事件委托机制来实现的,也就是说是通过诸如冒泡的方式 ...
随机推荐
- mysql + php 中文乱码 全是? 解决方法
在my.ini文件中找到[client]和[mysqld]字段,在下面均加上default-character-set=utf8,保存并关闭,重启服务器 在window下重启失败,这是因为你安装了高版 ...
- Android添加系统级顶层窗口 和 WindowManager添加view的动画问题
当Dialog有编辑框时如果选择会弹菜单窗口就不要用 Context applicationContext = mainActivity.getApplicationContext(); AlertD ...
- php pack()函数详解与示例
pack和unpack在一般的程序中还真的不容易见到,但是如果你用过很久以前的php生成excel你就会知道了.他的excel的头就是pack出来的最近在尝试与C交互的时候又用上了这玩意,所以不得不再 ...
- 集群服务器状态命令------rs.status()各个字段的含义
可根据rs.status() 查询集群服务器状态.字段解释: self 这个信息出现在执行rs.status()函数的成员信息中 stateStr用户描述服务器状态的字符串.有SECONDARY,PR ...
- CGGeometry.h详解
本文转载至:http://blog.csdn.net/chengyingzhilian/article/details/7894195 这些是在CGGeometry.h里的 CGPoint.CGSi ...
- 【BZOJ1414/3705】[ZJOI2009]对称的正方形 二分+hash
[BZOJ1414/3705][ZJOI2009]对称的正方形 Description Orez很喜欢搜集一些神秘的数据,并经常把它们排成一个矩阵进行研究.最近,Orez又得到了一些数据,并已经把它们 ...
- tomcat安装后问题解决
tomcat安装后问题解决 (1)tomcat无法正常启动的原因分析 JAVA_HOME 配置错误,或者没有配置 如果你的机器已经占有了8080 端口,则无法启动, 解决方法 (1) 你可以808 ...
- HTML5 Canvas 画图入门
HTML5 Canvas 画图入门 HTML5 Canvas 画图入门,仅供学习參考 <!DOCTYPE html> <html> <head> <meta ...
- jQuery局部动态刷新
AJAX 是与服务器交换数据的艺术,它在不重载全部页面的情况下,实现了对部分网页的更新. 在做项目的过程当中要用到jQuery动态刷新获取数据,上网查了一番教程,讲此知识点的教程很多,但个人感觉比较乱 ...
- [noi2002]M号机器人
3030年,Macsy正在火星部署一批机器人.第1秒,他把机器人1号运到了火星,机器人1号可以制造其他的机器人.第2秒,机器人1号造出了第一个机器人——机器人2号.第3秒,机器人1号造出了另一个机器人 ...