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 相关文章推荐
JS和jquery获取各种屏幕的宽度和高度的代码
Aug 02 Javascript
当鼠标滑过文本框自动选中输入框内容的JS代码分享
Nov 26 Javascript
JS获取各种浏览器窗口大小的方法
Jan 14 Javascript
jQuery窗口、文档、网页各种高度的精确理解
Jul 02 Javascript
禁止iframe页面的所有js脚本如alert及弹出窗口等
Sep 03 Javascript
Node.js调用fs.renameSync报错(Error: EXDEV, cross-device link not permitted)
Dec 27 Javascript
JQuery实现table中tr上移下移的示例(超简单)
Jan 08 jQuery
Vue 第三方字体图标引入 Font Awesome的方法
Sep 28 Javascript
vue实现后台管理权限系统及顶栏三级菜单显示功能
Jun 19 Javascript
jQuery设置下拉框显示与隐藏效果的方法分析
Sep 15 jQuery
vue 实现用户登录方式的切换功能
Apr 14 Javascript
在antd Form表单中select设置初始值操作
Nov 02 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
php5编程中的异常处理详细方法介绍
2008/07/29 PHP
PHP 实用代码收集
2010/01/22 PHP
php文档更新介绍
2011/07/22 PHP
在smarty中调用php内置函数的方法
2013/02/07 PHP
Codeigniter框架实现获取分页数据和总条数的方法
2014/12/05 PHP
PHP使用CURL实现多线程抓取网页
2015/04/30 PHP
PHP常见漏洞攻击分析
2016/02/21 PHP
PHP连接MySQL数据库操作代码实例解析
2020/07/11 PHP
再谈querySelector和querySelectorAll的区别与联系
2012/04/20 Javascript
jquery 跳到顶部和底部动画2句代码简单实现
2013/07/18 Javascript
jquery自定义滚动条插件示例分享
2014/02/21 Javascript
js(JavaScript)实现TAB标签切换效果的简单实例
2014/02/26 Javascript
jquery通过ajax加载一段文本内容的方法
2015/01/15 Javascript
JavaScript简介
2015/02/15 Javascript
jQuery实现对无序列表的排序功能(附demo源码下载)
2016/06/25 Javascript
聊一聊JS中的prototype
2016/09/29 Javascript
Angular2+国际化方案(ngx-translate)的示例代码
2017/08/23 Javascript
JS中的模糊查询功能
2019/12/08 Javascript
[27:08]完美世界DOTA2联赛PWL S2 SZ vs Rebirth 第二场 11.21
2020/11/23 DOTA
Python实现的百度站长自动URL提交小工具
2014/06/27 Python
Python实现抓取页面上链接的简单爬虫分享
2015/01/21 Python
Python文件与文件夹常见基本操作总结
2016/09/19 Python
python中实现k-means聚类算法详解
2017/11/11 Python
python保存数据到本地文件的方法
2018/06/23 Python
对python中两种列表元素去重函数性能的比较方法
2018/06/29 Python
利用Python将每日一句定时推送至微信的实现方法
2018/08/13 Python
Python使用pandas对数据进行差分运算的方法
2018/12/22 Python
Python的赋值、深拷贝与浅拷贝的区别详解
2020/02/12 Python
OpenCV Python实现图像指定区域裁剪
2021/03/12 Python
阿迪达斯意大利在线商店:adidas意大利
2016/09/19 全球购物
会计与审计专业自荐信范文
2014/03/15 职场文书
开会通知
2015/04/20 职场文书
文艺演出主持词
2015/07/01 职场文书
老人院义工活动感想
2015/08/07 职场文书
2016党员干部廉洁自律心得体会
2016/01/13 职场文书
Python 发送SMTP邮件的简单教程
2021/06/24 Python