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 相关文章推荐
几个比较经典常用的jQuery小技巧
Mar 01 Javascript
来自qq的javascript面试题
Jul 24 Javascript
用JQuery模仿淘宝的图片放大镜显示效果
Sep 15 Javascript
javascript制作坦克大战全纪录(2)
Nov 27 Javascript
JS中获取函数调用链所有参数的方法
May 07 Javascript
Vue.js tab实现选项卡切换
May 16 Javascript
jquery动态添加带有样式的HTML标签元素方法
Feb 24 jQuery
微信小程序网络封装(简单高效)
Aug 06 Javascript
Vue代码整洁之去重方法整理
Aug 06 Javascript
javascript 原型与原型链的理解及实例分析
Nov 23 Javascript
使用 Jest 和 Supertest 进行接口端点测试实例详解
Apr 25 Javascript
JS实现页面炫酷的时钟特效示例
Aug 14 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
一个用于MySQL的PHP XML类
2006/10/09 PHP
PHP 冒泡排序算法的实现代码
2010/08/08 PHP
php 启动时报错的简单解决方法
2014/01/27 PHP
php发送html格式文本邮件的方法
2015/06/10 PHP
PHP的关于变量和日期处理的一些面试题目整理
2015/08/10 PHP
PHP常用字符串输出方法分析(echo,print,printf及sprintf)
2021/03/09 PHP
ArrayList类(增强版)
2007/04/04 Javascript
Jquery弹出窗口插件 LeanModal的使用方法
2012/03/10 Javascript
js多级树形弹出一个小窗口层(非常好用)实例代码
2013/03/19 Javascript
javascript中几个容易混淆的概念总结
2015/04/14 Javascript
深入浅出分析javaScript中this用法
2015/05/09 Javascript
jquery分页插件jquery.pagination.js使用方法解析
2016/04/01 Javascript
微信小程序 仿美团分类菜单 swiper分类菜单
2017/04/12 Javascript
jquery replace方法去空格
2017/05/08 jQuery
JavaScript之Date_动力节点Java学院整理
2017/06/28 Javascript
基于Vue、Vuex、Vue-router实现的购物商城(原生切换动画)效果
2018/01/09 Javascript
原生JS实现的双色球功能示例
2018/02/02 Javascript
vue.js或js实现中文A-Z排序的方法
2018/03/08 Javascript
Vue组件通信的几种实现方法
2019/04/25 Javascript
JavaScript实现雪花飘落效果
2020/12/27 Javascript
[03:15]DOTA2-DPC中国联赛1月22日Recap集锦
2021/03/11 DOTA
Python接收Gmail新邮件并发送到gtalk的方法
2015/03/10 Python
Python 模块EasyGui详细介绍
2017/02/19 Python
Python爬虫实现百度图片自动下载
2018/02/04 Python
Python中的十大图像处理工具(小结)
2019/06/10 Python
Windows系统Python直接调用C++ DLL的方法
2019/08/01 Python
Python3视频转字符动画的实例代码
2019/08/29 Python
利用python Selenium实现自动登陆京东签到领金币功能
2019/10/31 Python
python GUI库图形界面开发之PyQt5动态(可拖动控件大小)布局控件QSplitter详细使用方法与实例
2020/03/06 Python
大众服装店创业计划书范文
2014/01/01 职场文书
优秀中学生事迹材料
2014/01/31 职场文书
师德师风剖析材料
2014/09/30 职场文书
被告答辩状范文
2015/05/22 职场文书
假期读书倡议书3篇
2019/08/19 职场文书
Spring Boot实战解决高并发数据入库之 Redis 缓存+MySQL 批量入库问题
2022/02/12 Redis
Linux中各个目录的作用与内容
2022/06/28 Servers