jquery 笔记 事件


Posted in Javascript onNovember 02, 2011

浏览器模型:
1、DOM第0级模型
事件处理程序通过吧函数实例的引用指派到DOM元素的属性而声明。这也是我们最常见的,如onclick等

<img onclick="alert('hello');" src="1.jpg" /> 
$("img").onmouseover = function(){alert("hello");}

(1)、其中比较好玩的是Event实例和事件冒泡
Event实例是大多数浏览器把事件的类实例作为第一个参数传给函数,但是ie中则是将event指定到window的属性;在获取目标元素w3c标准浏览器存在target,ie则取srcElement属性,为兼容事件如下写:
$("img").onclick=function(event){ 
if(!event) event = window.event; 
var target = event.target?event.target:event.srcElement; 
}

(2)、事件冒泡
目标元素获得机会吃力事件,事件模型坚持目标元素的父元素,看是否为同类型建立了处理程序,如果是,则也调用处理程序,直到DOM树顶部
对于w3c标准浏览器可使用event的stopPropagation(),对于ie可使用event的cancelBubble取消冒泡

2、第2级模型
解决0级模型中每个属性存储事件只能注册一个处理程序缺陷。

$("img").addEventListener('click',function1,false).addEventListener('click',function2,false);

在2级模型中,事件被触发,先从DOM树向下传播到目标元素(捕捉阶段),再向上冒泡,上面的addEventListener第三个参数为false时建立冒泡型处理程序,为ture时建立捕捉型处理程序。
这里的捕捉型也是第一次听说,因为ie6和7就不支持第2级模型,所以也难怪,但部分ie浏览器支持类似冒泡型的有attachEvent(eventName,handler)。

那么jquery的bind则我们解决了这些。。。
参考《jquery实战》

Javascript 相关文章推荐
THREE.JS入门教程(3)着色器-下
Jan 24 Javascript
JQuery DataTable删除行后的页面更新利用Ajax解决
May 17 Javascript
基于OO的动画附加插件,可以实现弹跳、渐隐等动画效果 分享
Jun 24 Javascript
js判断浏览器类型的方法
Aug 07 Javascript
JS二维数组的定义说明
Mar 03 Javascript
jQuery设置和获取HTML、文本和值示例
Jul 08 Javascript
js实现select跳转菜单新窗口效果代码分享(超简单)
Aug 21 Javascript
Javascript将数值转换为金额格式(分隔千分位和自动增加小数点)
Jun 22 Javascript
详解Vue2 无限级分类(添加,删除,修改)
Mar 07 Javascript
浅谈Vue2.0中v-for迭代语法的变化(key、index)
Mar 06 Javascript
JavaScript数据结构与算法之基本排序算法定义与效率比较【冒泡、选择、插入排序】
Feb 21 Javascript
ant-design-vue 实现表格内部字段验证功能
Dec 16 Javascript
分页栏的web标准实现
Nov 01 #Javascript
jquery键盘事件使用介绍
Nov 01 #Javascript
JS鼠标事件大全 推荐收藏
Nov 01 #Javascript
EasyUI中的tree用法介绍
Nov 01 #Javascript
jQuery代码优化 事件委托篇
Nov 01 #Javascript
jQuery代码优化 遍历篇
Nov 01 #Javascript
jQuery代码优化 选择符篇
Nov 01 #Javascript
You might like
PHP的简易冒泡法代码分享
2012/08/28 PHP
windows下配置apache+php+mysql时出现问题的处理方法
2014/06/20 PHP
PHP Try-catch 语句使用技巧
2016/02/28 PHP
php插入mysql数据返回id的方法
2018/05/31 PHP
关于Laravel-admin的基础用法总结和自定义model详解
2019/10/08 PHP
PHP预定义接口――Iterator用法示例
2020/06/05 PHP
js加解密 脚本解密
2008/02/22 Javascript
一个分享按钮的插件使用介绍(可扩展,内附开发制作流程)
2011/09/19 Javascript
jquery中trigger()无法触发hover事件的解决方法
2015/05/07 Javascript
javascript实现简单的分页特效
2015/08/12 Javascript
js漂浮广告实现代码
2015/08/15 Javascript
javascript中window.open在原来的窗口中打开新的窗口(不同名)
2015/11/15 Javascript
浅谈jquery点击label触发2次的问题
2016/06/12 Javascript
JQuery对ASP.NET MVC数据进行更新删除
2016/07/13 Javascript
JS判断浏览器是否安装flash插件的简单方法
2016/09/13 Javascript
AngularJS Toaster使用详解
2017/02/24 Javascript
基于Vue实现拖拽功能
2020/07/29 Javascript
详解JavaScript 为什么要有 Symbol 类型?
2019/04/03 Javascript
Layui选项卡制作历史浏览记录的方法
2019/09/28 Javascript
vue实现的多页面项目如何优化打包的步骤详解
2020/07/19 Javascript
原生jQuery实现只显示年份下拉框
2020/12/24 jQuery
python实现根据窗口标题调用窗口的方法
2015/03/13 Python
python使用gdal对shp读取,新建和更新的实例
2020/03/10 Python
Jupyter notebook运行Spark+Scala教程
2020/04/10 Python
使用Python操作MySQL的小技巧
2020/09/10 Python
Python实现加密的RAR文件解压的方法(密码已知)
2020/09/11 Python
Python tkinter之Bind(绑定事件)的使用示例
2021/02/05 Python
莫斯科购买书籍网站:Book24
2020/01/12 全球购物
PPP协议组成及简述协议协商的基本过程
2015/05/28 面试题
学生安全责任书
2014/04/15 职场文书
党员承诺书怎么写
2014/05/20 职场文书
机关作风建设心得体会
2014/10/22 职场文书
指导老师鉴定意见
2015/06/05 职场文书
新郎父母婚礼答谢词
2015/09/29 职场文书
MySQL索引失效的典型案例
2021/06/05 MySQL
基于Python实现对比Exce的工具
2022/04/07 Python