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 相关文章推荐
checkbox全选/取消全选以及checkbox遍历jQuery实现代码
Dec 02 Javascript
js实现在文本框光标处添加字符的方法介绍
Nov 24 Javascript
jquery 实现二级/三级/多级联动菜单的思路及代码
Apr 08 Javascript
js中cookie的添加、取值、删除示例代码
Oct 21 Javascript
JavaScript将页面表格导出为Excel的具体实现
Dec 27 Javascript
js实现的map方法示例代码
Jan 13 Javascript
javascript 10进制和62进制的相互转换
Jul 31 Javascript
javascript运算符——逻辑运算符全面解析
Jun 27 Javascript
angular中的cookie读写方法
Aug 02 Javascript
老生常谈js数据类型
Aug 03 Javascript
推荐几个不错的console调试技巧实现
Dec 20 Javascript
js对象简介与基本用法示例
Mar 13 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
千呼万唤始出来,DOTA2勇士令状不朽宝藏Ⅱ现已推出
2020/08/25 DOTA
php中ob(Output Buffer 输出缓冲)函数使用方法
2007/07/21 PHP
基于PHP静态类的原罪详解
2013/05/06 PHP
PHP实现导出带样式的Excel
2016/08/28 PHP
PHP缩略图生成和图片水印制作
2017/01/07 PHP
CodeIgniter框架验证码类库文件与用法示例
2017/03/18 PHP
JavaScript的面向对象(一)
2006/11/09 Javascript
点击进行复制的JS代码实例
2013/08/23 Javascript
js判断滚动条是否已到页面最底部或顶部实例
2014/11/20 Javascript
javascript面向对象快速入门实例
2015/01/13 Javascript
设计模式中的facade外观模式在JavaScript开发中的运用
2016/05/18 Javascript
jquery 一键复制到剪切板的实例
2017/09/20 jQuery
Node.js成为Web应用开发最佳选择的原因
2018/02/05 Javascript
vue.js内置组件之keep-alive组件使用
2018/07/10 Javascript
详解小程序用户登录状态检查与更新实例
2019/05/15 Javascript
vue vantUI实现文件(图片、文档、视频、音频)上传(多文件)
2019/10/15 Javascript
Vue自定义指令结合阿里云OSS优化图片的实现方法
2019/11/12 Javascript
javascript实现一款好看的秒表计时器
2020/09/05 Javascript
js实现限定区域范围拖拉拽效果
2020/11/20 Javascript
Python数据类型学习笔记
2016/01/13 Python
python3实现zabbix告警推送钉钉的示例
2019/02/20 Python
Python实现FM算法解析
2019/06/18 Python
详解Python 调用C# dll库最简方法
2019/06/20 Python
Django接收post前端返回的json格式数据代码实现
2019/07/31 Python
Python使用random模块生成随机数操作实例详解
2019/09/17 Python
Python 日志logging模块用法简单示例
2019/10/18 Python
Django全局启用登陆验证login_required的方法
2020/06/02 Python
HTML5 语义化结构化规范化
2008/10/17 HTML / CSS
HTML5中使用postMessage实现两个网页间传递数据
2016/06/22 HTML / CSS
自学考试自我鉴定范文
2013/09/26 职场文书
迎元旦广播稿
2014/02/22 职场文书
会计工作决心书
2014/03/11 职场文书
生日寄语大全
2014/04/08 职场文书
员工试用期自我鉴定范文
2014/09/15 职场文书
标枪加油稿
2015/07/22 职场文书
Oracle更换为MySQL遇到的问题及解决
2021/05/21 Oracle