JS-事件对象/event

事件对象/event

event包含了发生事件的所有信息内容,不如:发生事件类型,发生事件的元素,键盘按下状态等等

事件对象的创建,当事件发生时,游浏览器帮我们创建的,并通过参数的形式传递给事件处理程序的

事件获取方式

 //IE
 window.event;
 ​
 //非IE
     arguments[0];
 //事件处理程序的参数,第一个参数默认为event事件对象

事件属性

一个元素可以绑定多个事件

鼠标事件
鼠标事件 事件属性 鼠标事件 事件属性 鼠标事件 事件属性
鼠标单击 onclick 鼠标双击 ondblclick 鼠标移入 onmouseover
鼠标移出 onmouseout 鼠标进入 onmouseenter 鼠标离开 onmouseleave
鼠标按下 onmousedown 鼠标释放 onmouseup 鼠标移动 onmousemove

鼠标移入与移出:

元素的变动则执行,

从外部元素移入内部元素会触发内部移入与外部移入、移出。从内部元素移入外部元素会触发外部移入与内部移出。

鼠标进入与离开:

只针对元素包裹区域

从外部元素进入内部元素只会触发内部移入。从内部元素进入外部元素会触发内部离开。

鼠标点击

鼠标点击 = 鼠标按下 + 鼠标释放

鼠标移动

 idvObj.onmousemove = function(event){
     var eventObj = window.event||event[0];
     
     var cx = eventObj.clientX;
     var cy = eventObj.clientY;
     //获得客户区域X、Y坐标
     
     var sx = eventObj.screenX;
     var sy = eventObj.screenY;
     //获得鼠标相对屏幕的x和y 坐标
 }
键盘事件
键盘事件 键盘属性 键盘事件 键盘属性 键盘事件 键盘属性
键盘按下 onkeydown 键盘按下 onkeypress 键盘释放 onkeyup

onkeydown:所有件按下有效

onkeypress:特殊键(无键盘码的键)按下无效,只有字母字符键有效

事件对象的 altkey shiftkey ctrlkey

 // 事件对象的 altkey shiftkey ctrlkey
 ​
 document.onkeydown=function(event){
 let key_code =  event.keyCode;
     //先获得键盘码 (可以知道你按下了键盘的那个键)
//判断是否按钮了shift键
 if(e.shiftKey){
 console.log("你按下了shift键");
 }
 ​
 //是否按钮了ctrl键
 if(e.ctrlKey){
 console.log("你按下了ctrl键");
 }
 ​
 ​
 //是否按钮了alt键
 if(e.altKey){
 console.log("你按下了alt键");
  }
 }

 

猜你喜欢

转载自www.cnblogs.com/-Archenemy-/p/12397818.html
今日推荐