event 事件对象
关于event对象
在触发的事件的函数里面我们会接收到一个event对象,通过该对象我们可以得到需要的一些参数,比如说我们需要知道此事件作用到谁身上了,就可以通过event的属性target来获取到(IE暂且不谈),或者想阻止浏览器的默认行为可以通过方法preventDefault()来进行阻止
event对象的一些属性和方法:
|
属性
|
描述
|
|
altKey
|
返回当事件被触发时,”ALT” 是否被按下。
|
|
button
|
返回当事件被触发时,哪个鼠标按钮被点击。
|
|
clientX
|
返回当事件被触发时鼠标指针向对于浏览器页面(或客户区)的水平坐标 客户区指的是当前窗口。这里说的是浏览器的有效区域
|
|
clientY
|
返回当事件被触发时鼠标指针向对于浏览器页面(或客户区)的垂直坐标 客户区指的是当前窗口。这里说的是浏览器的有效区域
|
|
ctrlKey
|
返回当事件被触发时,”CTRL” 键是否被按下。
|
|
metaKey
|
返回当事件被触发时,”meta” 键是否被按下。
|
|
relatedTarget
|
返回与事件的目标节点相关的节点。
|
|
screenX
|
返回当某个事件被触发时,鼠标指针的水平坐标。鼠标相对于显示器屏幕x轴的位置
|
|
screenY
|
返回当某个事件被触发时,鼠标指针的垂直坐标。鼠标相对于显示器屏幕Y轴的位置
|
|
shiftKey
|
返回当事件被触发时,”SHIFT” 键是否被按下。
|
|
window.innerWidth
|
窗口尺寸属性:浏览器内窗口宽度
|
|
window.innerHeight
|
窗口尺寸属性:浏览器内窗口高度
|
IE 属性(除了上面的鼠标/事件属性,IE 浏览器还支持下面的属性)
|
属性
|
描述
|
|
cancelBubble
|
如果事件句柄想阻止事件传播到父容器,必须把该属性设为 true。
|
|
fromElemele
|
对于 mouseover 和 mouseout 事件,fromElement 引用移出鼠标的元素。
|
|
keyCode
|
对于 键盘 事件,该属性声明了被敲击的键生成的 Unicode 字符码。 每个按键的健码都是唯一的,我们可以通过这些健码来确定用户按下了哪个按键。
|
|
offsetX,offsetY
|
发生事件的地点在事件源元素的坐标系统中的 x 坐标和 y 坐标。 在当前元素中的坐标位置
|
|
returnValue
|
如果设置了该属性,它的值比事件句柄的返回值优先级高。把这个属性设置为false ,用来阻止默认事件
|
|
srcElement
|
对于生成事件的 Window 对象、Document 对象或 Element 对象的引用。
|
|
toElement
|
对于 mouseover 和 mouseout 事件,该属性引用移入鼠标的元素。
|
|
x,y
|
事件发生的位置的 x 坐标和 y 坐标,它们相对于用CSS动态定位的最
内层包容元素。
|
标准 Event 属性 下面列出了 2 级 DOM 事件标准定义的属性
|
属性和方法
|
描述
|
|
bubbles
|
返回布尔值,指示事件是否是起泡事件类型。
|
|
cancelable
|
返回布尔值,指示事件是否可拥可取消的默认动作。
|
|
currentTarget
|
返回其事件监听器触发该事件的元素。
|
|
eventPhase
|
返回事件传播的当前阶段。
|
|
target
|
返回触发此事件的元素(事件的目标节点)。
|
|
timeStamp
|
返回事件生成的日期和时间。
|
|
type
|
返回当前 Event 对象表示的事件的名称。
|
|
initEvent()
|
初始化新创建的 Event 对象的属性。
|
|
preventDefault()
|
通知浏览器不要执行与事件关联的默认动作。
|
|
stopPropagation()
|
不再派发事件。
|
event.pageX、event.pageY类似于event.clientX、event.clientY,但它们使用的是文档坐标而非窗口坐标。这2个属性不是标准属性,但得到了广泛支持。IE事件中没有这2个属性。
event 事件对象的更多相关文章
- trigger()的event事件对象之坑
问题引入,先贴一段有问题的代码,如果你对 trigger() 这个函数了解不透彻,还真看不出这段代码错在哪.完成的功能是样式转换器,想让页面在加载后自行触发点击事件隐藏三个按钮,但是效果如图并没有隐 ...
- 简单总结焦点事件、Event事件对象、冒泡事件
每学习一些新的东西,要学会复习,总结和记录. 今天来简单总结一下学到的几个事件:焦点事件.Event事件对象.冒泡事件 其实这几个事件应该往深的说是挺难的,但今天主要是以一个小菜的角度去尝试理解一些基 ...
- Python多线程-Event(事件对象)
Event 事件对象管理一个内部标志,通过set()方法将其设置为True,并使用clear()方法将其设置为False.wait()方法阻塞,直到标志为True.该标志初始为False. 方法: i ...
- 第53天:鼠标事件、event事件对象
-->鼠标事件-->event事件对象-->默认事件-->键盘事件(keyCode)-->拖拽效果 一.鼠标事件 onclick ---------------鼠标点击事 ...
- vue 笔记,ref 及 $event 事件对象
本文仅用作简单记录 ref : 在标签上添加 ref = “name” ,表示获取当前元素节点 <input type="text" ref="info" ...
- event事件对象
事件对象event: 在触发DOM事件的时候都会产生一个对象 1.type:获取事件类型 2.target:获取事件目标 3.stopPropagation():组织事件冒泡 4.preventDef ...
- event事件对象和clientX,clientY
一.event : 事件对象 , 当一个事件发生的时候,和当前这个对象发生的这个事件有关的一些详细的信息都会被临时保存到一个指定地方-event对象,供我们在需要的调用.如:飞机-黑匣子 事件对象必须 ...
- jquery之event与originalEvent的关系、event事件对象用法浅析
在jquery中,最终传入事件处理程序的 event 其实已经被 jQuery 做过标准化处理, 其原有的事件对象则被保存于 event 对象的 originalEvent 属性之中, 每个 even ...
- (转)内核线程对象--Event事件对象
在所有的内核对象中,事件内核对象是个最基本的对象.事件能够通知一个操作已经完成. 客户机和一个服务器,它们之间需要互相进行通信例子(vs2008 ) 事件内核对象的组成 一个使用计数(与所有内核对象一 ...
- 【js】event(事件对象)详解
1.事件对象 Event 对象代表事件的状态,比如事件在其中发生的元素.键盘按键的状态.鼠标的位置.鼠标按钮的状态. 什么时候会产生Event 对象呢? 例如: 当用户单击某个元素的时候,我们给这个元 ...
随机推荐
- TypeScript方法的定义
在 JavaScript 中,有两种方式定义方法. 1.命名的方法 function add(x,y){ return x+y;}2.匿名方法 var myAdd = function(x,y) { ...
- 盘点|2021年最受欢迎Linux桌面操作系统前十名
镜像下载.域名解析.时间同步请点击 阿里云开源镜像站 阿里云开源镜像站利用云服务上的优势,提供快速.稳定的镜像分发服务.和免费的CDN加速服务.更新频率高,基本上一天一更新,对于Centos/Ubun ...
- Oracle 11g中查询CPU占有率高的SQL
oracle版本:oracle11g 背景:今天在Linux中的oracle服务上,运用top命令发现许多进程的CPU占有率是100%. 操作步骤: 以进程PID:7851为例 执行以下语句: 方法一 ...
- 【网鼎杯2020青龙组】Web WriteUp
AreUSerialz 打开题目直接给出了源代码 <?php include("flag.php"); highlight_file(__FILE__); class Fil ...
- 14FPGA综设之图像边沿检测的sobel算法
连续学习FPGA基础课程接近一个月了,迎来第一个有难度的综合设计,图像的边沿检测算法sobel,用verilog代码实现算法功能. 一设计功能 (一设计要求) (二系统框图) 根据上面的系统,Veri ...
- 有序全排列c++实现(递归)
1 #include <iostream> 2 #include <algorithm> 3 #include <iterator> 4 #include < ...
- Dubbo 如何优雅停机?
Dubbo 是通过 JDK 的 ShutdownHook 来完成优雅停机的,所以如果使用 kill -9 PID 等强制关闭指令,是不会执行优雅停机的,只有通过 kill PID 时,才 会执行.
- SpringBoot项目意外出现 循环依赖和注入的对象意外是Null的问题 Requested bean is currently in creation: Is there an unresolvable circular reference? 或 nested exception is java.lang.NullPointerException
1.Caused by: org.springframework.beans.factory.BeanCreationException: Error creating bean with name ...
- 什么是 Spring Cloud Bus?我们需要它吗?
考虑以下情况:我们有多个应用程序使用 Spr ng Cloud Config 读取属性,而S ring Cloud Config 从GIT 读取这些属性. 下面的例子中多个员工生产者模块从 Employe ...
- sleep()和wait()的区别?notify()和notifyAll()的区别?start()和run()的区别?
sleep()和wait()的区别? 这两个方法来自不同的类分别是Thread和Object sleep方法没有释放锁,而wait方法释放了锁,使得其他线程可以使用同步控制块或者方法.wait,not ...