js事件【续】(事件类型)
一、UI事件【使用时需要添加on eg: onload 页面加载完成事件】
load 【一张页面或一幅图像完成加载】
页面加载后触发的事件,即进入页面后
unload 【用户退出页面】
页面卸载后触发的事件,即离开页面时(firefox不支持)
select 【文本被选中】
当用户选择文本框(<input>,<textarea>)中的一个或多个字符时
resize 【窗口或框架被重新调整大小】
当浏览器窗口被调整到一个新的高度或者宽度时,会触发
scroll
当用户滚动带滚动条的元素中的内容时,在该元素上触发resize,scroll会在变化期间重复被激发,尽量保持代码简单
二、焦点事件【使用时前面添加on eg: onblur 点击事件】
blur 失焦事件
focus 聚焦事件【支持冒泡】
//IE支持
focusin 与focus等价 【支持冒泡】
focusout 与blur等价 【支持冒泡】
三、鼠标事件与滚轮事件【使用时前面均需要添加on eg: onchange 元素改变事件】
change HTML元素发生改变
reset 重置按钮被点击
submit 确认按钮被点击
click 鼠标左键点击【鼠标按下及松开】事件或按下回车键触发事件
dblclick 鼠标双击事件 相当于相继触发两次click事件
mousedown 鼠标按钮(包括鼠标左右按键)按下事件
mouseup 鼠标释放按钮事件
mousemove 鼠标在指定元素内移动事件
mousewheel 滚轮事件
mouseenter 鼠标光标从元素外部首次移动到元素范围内激发 【不支持冒泡、不支持子元素】
mouseleave 在位于元素上方的鼠标光标移动到元素范围之外时触发 【不支持冒泡、不支持子元素】
mouseover 鼠标位于元素外部,将其首次移入另一个元素边界之内时触发 【支持子元素】
mouseout 在位于元素上方的鼠标光标移入到另外一个元素中 【支持子元素】在被选元素上与mouseleave效果相同
四、键盘与文本事件【使用document调用,使用时前面也需要加on eg: onkeydown 键盘按下事件】
keydown 按下键盘任意键时触发,如果按住不放会重复触发此事件
keypress 按下键盘字符键时触发,如果按住不放会重复触发此事件
keyup 释放键盘上键时触发
说明:
当键盘事件发生时,event对象的keyCode属性【event.keyCode】中会包含一个代码与键盘上的特定键对应,对数字字母键,
keyCode属性的值与ASCII码中对应的小写字母和数字编码相同
五、相关元素,event特殊属性
1、客户区坐标位置 【clientX,clientY Safari浏览器不兼容】
事件发生时,鼠标指针在视口中的水平坐标位置为clientX和垂直坐标位置clientY
2、页面坐标位置 【pageX,pageY 不兼容ie浏览器】
事件发生时,页面滚动时,鼠标指针在页面本身而非视口的坐标pageY = 滚动距离 + clientY
页面没有滚动的时候,pageX和pageY的值与clientX和clientY值相等
3、屏幕位置 【screenX,screenY】
4、修改键 【布尔类型】
用来判断对应的按键是否被按下shiftKey,ctrlKey,altKey,metaKey
5、鼠标按钮 【mousedown,mouseup】
该事件的event对象中包含了button属性,表示按下或释放的按钮
event.button属性值: 【0、1、2】
0表示鼠标左键按钮
1表示中间的滚动按钮
2表示鼠标右键按钮
js事件【续】(事件类型)的更多相关文章
- JS中的事件类型和事件属性的基础知识
周末无聊, 这几天又复习了下JS搞基程序设计3, 想着好记性不如浪笔头哇, 要么把这些东西写下来, 这样基础才能更加扎实么么哒, 知道的同学也可以直接过一下,当做复习, 小姨子再也不用担心我的学习啦 ...
- JS事件流、DOM事件流、IE事件处理、跨浏览器事件处理、事件对象与类型
事件的移除 removeEventListener() 第二个参数需要指定要移除的事件句柄,不能是匿名函数,因为无法识别 想要移除成功,那么三个参数必须跟addEventListener中的三个完全一 ...
- 《JS高程》事件类型学习笔记
事件类型: UI事件&焦点事件: 鼠标滚轮事件: 键盘与文本事件: 复合事件&变动事件: HTML5事件: 设备事件&触摸与手势事件:
- Node.js:events事件模块
Nodejs的大部分核心API都是基于异步事件驱动设计的,所有可以分发事件的对象都是EventEmitter类的实例. 大家知道,由于nodejs是单线程运行的,所以nodejs需要借助事件轮询,不断 ...
- 怎么理解js中的事件委托
怎么理解js中的事件委托 时间 2015-01-15 00:59:59 SegmentFault 原文 http://segmentfault.com/blog/sunchengli/119000 ...
- [JS]笔记12之事件机制--事件冒泡和捕获--事件监听--阻止事件传播
-->事件冒泡和捕获-->事件监听-->阻止事件传播 一.事件冒泡和捕获 1.概念:当给子元素和父元素定义了相同的事件,比如都定义了onclick事件,点击子元素时,父元素的oncl ...
- js中的事件委托或是事件代理详解
起因: 1.这是前端面试的经典题型,要去找工作的小伙伴看看还是有帮助的: 2.其实我一直都没弄明白,写这个一是为了备忘,二是给其他的知其然不知其所以然的小伙伴们以参考: 概述: 那什么叫事件委托呢?它 ...
- js学习笔记---事件代理
事件机制可以分为捕获型和冒泡型.捕获型是事件由父级元素(DOM)传递到子元素.冒泡型正好相反.事件机制默认为冒泡型.事件机制可以通过参数指定. 事件委托可以将我们绑定在document上的事件自动绑定 ...
- JS的Touch事件们,触屏时的js事件
丫的,终于找到了JS在平板电脑上的事件!!! iphone.ipod Touch.ipad触屏时的js事件 1.Touch事件简介 pc上的web页面鼠标会产生onmousedown.on ...
- 《JS高程》事件学习笔记
事件:文档或浏览器窗口中发生的一些特定的交互瞬间,也即用户或浏览器自身执行的某种动作. -------------------------------------------------------- ...
随机推荐
- 编程语言及python介绍
编程语言及python介绍 1.编程语言分类 机器语言 优点:执行效率高 缺点:开发效率极低,跨平台性差 汇编语言 优点:较机器语言执行效率稍低 缺点:较机器语言开发效率稍高,仍然很低,跨平台性差 高 ...
- css做的艺术字效果
Arctext.js 转自 http://tympanus.net/Development/Arctext/
- 进程及Python实现
进程杂谈 #进程就是正在执行的一个过程,是对正在运行程序的一个抽象 #进程由程序.数据集和进程控制块(最重要的,进程切换 状态如何保存,恢复和记录)组成 """ 进程调度 ...
- ActiveMQ消息可靠性-签收
非事务模式下消费者签收 动签收就像快递到达时,快递寄送点给你签收了,不用你自己去签收,而手动签收就是必须我本人签收, 自动签收(默认为自动签收) 手动签收:能够避免消息的重复消费 当设置为手动签收时, ...
- qt中窗体全屏
原文地址:https://www.cnblogs.com/wiessharling/p/3750461.html 近期在学习QT时遇到了很多问题这也是其中一个,个人通过在各种书籍和网络上的查阅找到了一 ...
- 将HashMap转换为List
背景 SpringBoot中,使用@RquestBody注解 hashMap 接收多个参数的json字符串数据,包括一个数组和一个int值.数组中为一个个的对象组成. 问题 使用 map.ge ...
- 【LG5444】[APIO2019]奇怪装置
[LG5444][APIO2019]奇怪装置 题面 洛谷 题目大意: 给定\(A,B\),对于\(\forall t\in \mathbb N\),有二元组\((x,y)=((t+\lfloor\fr ...
- 第02组 Alpha冲刺(2/4)
队名:十一个憨批 组长博客 作业博客 组长黄智 过去两天完成的任务:写博客,复习C语言 GitHub签入记录 接下来的计划:构思游戏实现 还剩下哪些任务:敲代码 燃尽图 遇到的困难:Alpha冲刺时间 ...
- centos里的压缩解压命令tar总结
压缩 tar czvf 压缩文件名称.tar.gz 文件或者目录名称 比如:tar czvf backup.tar.gz /etc,把/etc目录打包成文件backup.tar.gz c是打包 z是g ...
- Makefile文件基本格式
以下是Makefile的基本模板 #指定编译器CC = g++#指定编译参数CFLAGS = -std=c++11 #指定头文件路径,此处用于指定非标准库的头文件路径INC = -I./ -I /us ...