JS----事件3
一 事件对象(event):与特定事件相关且包含有关该事件详细信息的对象
通过事件可以触发event对象的元素,鼠标的位置及状态,按下的键等等
event对象只在事件发生的过程中才有效
非IE浏览器里的event跟IE里的不同,IE里面的是全局变量,随时都可用
非IE浏览器需要用参数诱导才能使用是运行时的一个局部变量
clientX:鼠标在浏览器窗口中的横向坐标
clientY:鼠标在浏览器窗口中的纵向坐标
二 事件流:描述的是页面中接受事件的顺序
在w3c的标准里面规定了事件的执行顺序要经历两个过程:事件捕获,事件冒泡
事件捕获:由最不具体的节点接收事件,而最具体的节点最后接收---由外到内的过程
最不具体的节点:document或者window
最具体的节点:绑定事件的对象最里层的节点
事件冒泡:由具体的元素接收,然后逐级向外面传播至最不具体的节点---由内到外的过程
整个事件流的顺序:先接收再传播
阻止事件冒泡:因为执行函数是在冒泡阶段执执行的
stopPropagation();
cancelBubble=true;
window.event?window.event.cancelBubble=true:e.stopPropagation();
阻止事件的默认行为:
preventDefault();
returnValue=false;
window.event?window.event.returnValue=false:e.preventDefault();
三 事件处理程序---事件后面绑定的函数
1 HTML事件处理:
直接添加到HTML结构当中
<tag onclick="funName()"></tag>---HTML的事件属性
2 DOM0级事件处理:
把一个函数赋值给一个事件
DOM.on事件名=function(){---对象的事件属性
程序块;
}
3 DOM2级事件处理:
添加事件句柄:
非IE低版本:
addEventListener("EventType",FunName,Bool);---事件句柄
true:在事件捕获阶段执行事件处理程序
false:在事件冒泡阶段执行事件处理程序
IE低版本:
attachEvent("on事件名",函数名);---只支持事件冒泡的阶段
移除事件句柄:
removeEventListener("EventType",FunName,Bool);
detachEvent("on事件名",函数名);
只能移除没有带参数的事件函数
JS----事件3的更多相关文章
- dynamic-css 动态 CSS 库,使得你可以借助 MVVM 模式动态生成和更新 css,从 js 事件和 css 选择器的苦海中脱离出来
dynamic-css 使得你可以借助 MVVM 模式动态生成和更新 css,从而将本插件到来之前,打散.嵌套在 js 中的修改样式的代码剥离出来.比如你要做元素跟随鼠标移动,或者根据滚动条位置的变化 ...
- 什么是JS事件冒泡?
什么是JS事件冒泡?: 在一个对象上触发某类事件(比如单击onclick事件),如果此对象定义了此事件的处理程序,那么此事件就会调用这个处理程序,如果没有定义此事件处理 程序或者事件返回true,那么 ...
- js事件技巧方法整合
window.resizeTo(800,600); //js设置浏览器窗口尺寸 window.open (function(){ resizeTo(640,480);//设置浏览器窗口尺寸 moveT ...
- js事件浅析
js中关于DOM的操作很多,因此js事件机制也就尤为重要. 事件绑定形式: 一. 内联形式 耦合度高,不利于维护 <button onclick="alert('你点击了这个按钮'); ...
- js 事件大全
Js事件大全一般事件 事件 浏览器支持 描述onClick IE3|N2|O3 鼠标点击事件,多用在某个对象控制的范围内的鼠标点击onDblClick IE4|N4|O 鼠标双击事件onMouseDo ...
- 原生JS事件绑定方法以及jQuery绑定事件方法bind、live、on、delegate的区别
一.原生JS事件绑定方法: 1.通过HTML属性进行事件处理函数的绑定如: <a href="#" onclick="f()"> 2.通过JavaS ...
- JS事件
JS事件: 声明:为了事件对象event跨浏览器兼容: var oEvent==ev||event; 所以在下面用到 event 的地方都用 oEvent 代替 1)doucument的 ...
- 原生js事件和jquery事件的执行顺序问题
场景:近日,写前端页面时候,在针对输入框input操作时,用到了jquery的插件,插件中使用了jquery的focus()和blur()方法.但是同时,又需要在插件之外再针对输入框的获取焦点和失去焦 ...
- 特殊js事件
1:点击enter事件 $(document).keypress(function(e) { // 回车键事件 if(e.which == 13) { submitForm(); } }); 2:JQ ...
- js 事件
事件:一般用于浏览器与用户操作进行交互 js事件的三种模型:内联模型.脚本模型.DOM2模型 内联模型:事件处理函数是HTML标签的属性 <input type="button&quo ...
随机推荐
- Struts2学习:Action使用@Autowired注入为null的解决方案
1.pom.xml引入struts2-spring-plugin <dependency> <groupId>org.apache.struts</groupId> ...
- linux常用命令总结-updating
Linux 命令总结 启动终端: ctr+alt+t终端字体放大: ctr+shift+'+',终端字体缩小: ctr+'-'ls: 查看当前目录下的文件信息pwd: 查看目录所在的路径touch: ...
- 《GPU高性能编程CUDA实战》第四章 简单的线程块并行
▶ 本章介绍了线程块并行,并给出两个例子:长向量加法和绘制julia集. ● 长向量加法,中规中矩的GPU加法,包含申请内存和显存,赋值,显存传入,计算,显存传出,处理结果,清理内存和显存.用到了 t ...
- ubuntu 14.04 安装 Apache Thrift 0.10
1.到官网下载源码压缩文件 https://thrift.apache.org/download 2.安装依赖软件,可以参考 https://thrift.apache.org/docs/instal ...
- webform(复合控件)
一.组合单选 RadioButtonList 单选按钮与简单控件不同,可理解为在集合中放置多对象 例: <asp:RadioButtonList ID="RadioButtonList ...
- Mybatis学习3——动态代理
动态代理只需要接口和mapper映射文件不需要实现类 动态代理规范 1.namespace必须是接口的全路径 2.接口的方法必须与sql的id一致 3.接口的入参与parameterType类型一致 ...
- python大法好——变量、常量、input()、数据类型、字符串、格式化输出、运算符、流程控制语句、进制、字符编码
python基础知识 1.变量 变量:把程序运算的中间结果临时存到内存里,以备后面的代码可以继续调用. 作用:A.存储数据. B.标记数据. 变量的声明规则: A:变量名只能是字母,数字或下划线任意组 ...
- Linux上VNC常见命令
参考链接: http://blog.csdn.net/russle/article/details/4757888 http://www.linuxidc.com/Linux/2016-06/1320 ...
- Oracle掌管权限和角色
转自:https://blog.csdn.net/without_bont/article/details/79862112 掌管权限和角色 这一部分我们主要看oracle中如何管理权限和角色,权限和 ...
- Redis 发布与订阅模式
subscribe 订阅 publish 发布 频道 发布内容