jquery - 动态绑定事件
举个例子:
html页面
<div><button type="button" class="test">测试</button></div>
js页面
方法1:
$('.test').click(function(){
alert('test');
})
方法2:
$('div').on('click','.test',function(){
alert('test');
})
上面两个方法表面上的效果是一样,但是实际上方法2是有动态绑定事件的功能。
例如一个动态添加的元素,如果这个元素带有test类选择器,用方法1点击该元素是没有任何反应的,用方法2点击元素是会触发事件的。
jquery - 动态绑定事件的更多相关文章
- jquery动态绑定事件
什么是动态绑定? 动态绑定是指动态添加的DOM节点或者html元素,他们最开始时运行的时候是不存在的.如果要给这些动态加入的节点增加事件,就必须要用jquery的on方法来绑定事件. $('.cont ...
- $("#XXX").click()和$("#YYY").on("click","指定的元素",function(){});的区别(jQuery动态绑定事件)
//绑定 下一页 的点击事件 $("a[aria-label='Next']").click(function(){ $("a[aria-label='Previous' ...
- Jquery中$("").事件()和$("").on("事件","指定的元素",function(){});的区别(jQuery动态绑定事件)
这个是在学习时不懂的问题,记录下来方便查看 转至https://www.cnblogs.com/mr-wuxiansheng/p/7136864.html //绑定 下一页 的点击事件 $(" ...
- jQuery动态绑定事件(左右移动)
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- jquery json遍历和动态绑定事件
<div id='tmpselectorList' style='border: 1px solid grey;max-height: 150px;position:absolute;text- ...
- jQuery的动态绑定事件的应用
注意:bind()的事件绑定是只对当前页面选中的元素有效.如果你想对动态创建的元素bind()事件,是没有办法达到效果的 <script src="jquery-1.11.2.min. ...
- [转]使用 jQuery Mobile 与 HTML5 开发 Web App —— jQuery Mobile 事件详解
在前文<使用 jQuery Mobile 与 HTML5 开发 Web App —— jQuery Mobile 默认配置与事件基础>中,Kayo 对 jQuery Mobile 事件的基 ...
- jquery 动态绑定bind()及模拟鼠标点击A链接
近来自觉前端有小小进步,幸而记之. 1.两个 css class 紧挨在一起 则在html元素中,要同时拥有这两个class,才能起作用 .block.db{ background-image:url ...
- jQuery的事件绑定与触发 - 学习笔记
jQuery的事件绑定与触发 事件绑定 自动触发事件 常用的鼠标事件 事件冒泡和默认行为 事件冒泡 默认行为 获得当前鼠标的位置和按键 jQuery的事件绑定与触发 事件绑定 基本绑定 $(eleme ...
随机推荐
- 常见的 HTTP 状态代码及原因
代码 说明 备注 200 确定 IIS 7.0.IIS 7.5 和 IIS 8.0 成功处理了请求. 304 未修改 客户端浏览器请求已处于缓存中的文档,并且自从该文档被缓存后,未修改此文档.客户端浏 ...
- mongodb_性能监控
一.使用mongostat.exe cd C:\Program Files\MongoDB\Server\3.0\bin\ --> mongostat.exe --> mongostat ...
- javascript快速入门21--DOM总结
跨浏览器开发 市场上的浏览器种类多的不计其数,它们的解释引擎各不相同,期待所有浏览器都一致的支持JavaScript,CSS,DOM,那要等到不知什么时候,然而开发者不能干等着那天.历史上已经有不少方 ...
- CSS3 animation动画
CSS3 animation动画 1.@keyframes 定义关键帧动画2.animation-name 动画名称3.animation-duration 动画时间4.animation-timin ...
- min-height IE6的解决方案
selector { min-height:500px; height:auto !important; height:500px; } 因为IE6中当内容大于容器高度或宽度时,就会撑破容器.并且在同 ...
- hadoop2.2.0伪分布式安装
修改主机名和IP的映射关系 vi /etc/hosts 192.168.61.134 hadoop 关闭防火墙 #查看防火墙状态 service iptables status #关闭防火墙 serv ...
- 【后台管理系统】—— Ant Design Pro入门学习&项目实践笔记(三)
前言:前一篇记录了[后台管理系统]目前进展开发中遇到的一些应用点,这一篇会梳理一些自己学习Ant Design Pro源码的功能点.附:Ant Design Pro 在线预览地址. Dashboard ...
- java压缩 GZIP进行简单压缩,ZIP进行多文件保存
java压缩 GZIP进行简单压缩,ZIP进行多文件保存 watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvbGlhbmdydWkxOTg4/font/5a6 ...
- IReferenceCounted DotNetty.Common
// Copyright (c) Microsoft. All rights reserved. // Licensed under the MIT license. See LICENSE file ...
- Stack Exchange 的架构
近日,Stack Exchange系统管理员blog上发布了一篇关于Stack Exchange的架构一瞥,其包括了Stack Overflow, Server Fault 和 Super User的 ...