JavaScript 学习笔记(十六) js事件


Posted in Javascript onFebruary 01, 2010

回顾
事件对象里包含三个方面的信息····回看上一篇内容!

事件对象里的属性和方法,主要是鼠标和键盘的信息。

1. 获取事件类型

事件对象属性type

2. 获取按键代码

事件对象属性keyCode:回车为13,空格为32,后退键为8

3. 检测Shift、Alt、Ctrl键

事件对象属性是否被按下:shiftKey、altKey、ctrlKey

4. 获取客户端坐标

事件对象属性clientX和clientY

5. 获取屏幕坐标

事件对象属性screenX和screenY

事件的类型
根据触发事件的事物和事件发生的对象,可将浏览器中发生的事件分为几个类型:

一、 鼠标事件

每个鼠标事件都会给以下event对象的属性填入值:

1.坐标属性(如clientX 和 client 等)

2.Type属性

3.Targer(DOM)或serElement(IE)属性(目标对象属性)

4.shiftKey、ctrlKey、altKey和metaKey(DOM)属性

5.button属性(只在mouse事件中)

(oEvent.target || oEvent.srcElement).id逻辑符或操作符作用于两个对象时,第一个对象非空,返回第一个对象,否则返回第二个对象,这里表示的是引起事件的元素的ID。

二、 键盘事件

Keydown --- 在键盘上按下某按键时发生。一直按着某键,它则会不断触发。

Keypress --- 按下一个按键,并产生一个字符时产生(也就是不管类似Shit ctrl alt之类的键。)一直按键时,它会持续发生。

Keyup --- 释放按着的按键时发生

1. 事件的属性

对每个键盘事件,会填入以下的事件属性:

keyCode属性(键位的ASC码值)

charCode属性(仅DOM)

target(DOM)与srcElement(IE)属性

shiftKey、ctrlKey、altKey和metaKey(DOM)属性

2.顺序

当用户按一次某字符按键时,会按以下顺序发生事件:

(1)、keydown;

(2)、keypress;

(3)、keyup;

如果用户按一次某非字符按键(例如shift),会按以下顺序发生事件:

(1)、keydown;

(2)、keyup;

三、 HTML事件

onload、unload、resize、scroll等事件。

四、 突变事件

文档或元素元素的子树的添加删除节点,目前还没有任何主流浏览器实现了它。

Javascript 相关文章推荐
JavaScript 利用StringBuffer类提升+=拼接字符串效率
Nov 24 Javascript
javascript重复绑定事件造成的后果说明
Mar 02 Javascript
前端轻量级MVC框架CanJS详解
Sep 26 Javascript
AngularJS学习笔记之TodoMVC的分析
Feb 22 Javascript
每天一篇javascript学习小结(RegExp对象)
Nov 17 Javascript
通用javascript代码判断版本号是否在版本范围之间
Nov 29 Javascript
JS实现的简单标签点击切换功能示例
Sep 21 Javascript
import与export在node.js中的使用详解
Sep 28 Javascript
vue-router路由懒加载和权限控制详解
Dec 13 Javascript
Jquery获取radio选中值实例总结
Jan 17 jQuery
JS中比Switch...Case更优雅的多条件判断写法
Sep 05 Javascript
简单谈谈offsetleft、offsetTop和offsetParent
Dec 04 Javascript
js左侧多级菜单动态的解决方案
Feb 01 #Javascript
javascript 三种编解码方式
Feb 01 #Javascript
对字符串进行HTML编码和解码的JavaScript函数
Feb 01 #Javascript
javaScript 关闭浏览器 (不弹出提示框)
Jan 31 #Javascript
javascript让setInteval里的函数参数中的this指向特定的对象
Jan 31 #Javascript
详细讲解JS节点知识
Jan 31 #Javascript
javascript中的array数组使用技巧
Jan 31 #Javascript
You might like
用Simple Excel导出xls实现方法
2012/12/06 PHP
免费空间广告万能消除代码
2006/09/04 Javascript
JQuery.closest(),parent(),parents()寻找父结点
2012/02/17 Javascript
jQuery的slideToggle方法实例
2013/05/07 Javascript
javascript不可用的问题探究
2013/10/01 Javascript
javascript异步编程的4种方法
2014/02/19 Javascript
jquery插件Jplayer使用方法简析
2016/04/22 Javascript
javascript函数的四种调用模式
2017/01/08 Javascript
vue-cli的webpack模板项目配置文件分析
2017/04/01 Javascript
angular使用post、get向后台传参的问题实例
2017/05/27 Javascript
JavaScript中一些特殊的字符运算
2017/08/17 Javascript
node实现基于token的身份验证
2018/04/09 Javascript
js实现延迟加载的几种方法详解
2019/01/19 Javascript
[02:43]DOTA2英雄基础教程 半人马战行者
2014/01/13 DOTA
[05:48]DOTA2英雄梦之声vol21 屠夫
2014/06/20 DOTA
[01:15:36]加油刀塔第二期网络版
2014/08/09 DOTA
Python自动化测试工具Splinter简介和使用实例
2014/05/13 Python
使用70行Python代码实现一个递归下降解析器的教程
2015/04/17 Python
python传递参数方式小结
2015/04/17 Python
python使用opencv驱动摄像头的方法
2018/08/03 Python
python修改txt文件中的某一项方法
2018/12/29 Python
详解Python:面向对象编程
2019/04/10 Python
Python列表切片常用操作实例解析
2020/03/10 Python
基于python实现音乐播放器代码实例
2020/07/01 Python
Python 3.9的到来到底是意味着什么
2020/10/14 Python
纯CSS3实现运行时钟的示例代码
2021/01/25 HTML / CSS
H5离线存储Manifest原理及使用
2020/04/28 HTML / CSS
美国最值得信赖的宠物药房:Allivet
2019/03/23 全球购物
美国亚洲时尚和美容产品的一站式网上商店:Stylevana
2019/09/05 全球购物
static关键字的用法
2013/10/07 面试题
新闻记者个人求职的自我评价
2013/11/28 职场文书
世界地球日活动总结
2015/02/09 职场文书
刑事附带民事起诉状
2015/05/19 职场文书
水浒传读书笔记
2015/06/25 职场文书
九年级历史教学反思
2016/02/19 职场文书
Python万能模板案例之matplotlib绘制直方图的基本配置
2022/04/13 Python