美文网首页
event事件对象

event事件对象

作者: fb941c99409d | 来源:发表于2020-01-07 21:01 被阅读0次

事件对象

https://developer.mozilla.org/zh-CN/docs/Web/API/Event

兼容写法
在IE8中及以下,响应函数被触发时,浏览器不会传递事件对象,是作为window对象的属性保存
element.addElementListener('mousemove',function(e){
    e = e || window.event;
})

常用属性

  • e.type : 返回事件类型 如"click mouseover...不带on"
  • e.target 返回事件源 (兼容IE8以下e.srcElement)
  • e.currentTarget 事件绑定在谁身上就返回谁
  • e.stopPropagation()阻止冒泡 (兼容IE8以下e.cancelBubble=true)
  • e.preventDefault() 阻止默认行为 (兼容IE8以下e.returnValue=false)

MouseEvent

https://developer.mozilla.org/zh-CN/docs/Web/API/MouseEvent

  • clientX 鼠标相对浏览器视口的X坐标 不包括滚动条滚动距离。
  • clientY 鼠标相对浏览器视口的Y坐标 不包括滚动条滚动距离。
  • pageX 鼠标相对页面的Y坐标 包括滚动条滚动距离。 不支持IE8及以下
  • pageY 鼠标相对页面的Y坐标 包括滚动条滚动距离 不支持IE8及以下
/*兼容写法 chrome认为滚动条在body上 火狐认为html上
var scrollTop =  document.body.scrollTop || document.documentElement.scrollTop;
var scrollLeft =  document.body.scrollLeft || document.documentElement.scrollLeft;
element.style.left = e.clientX+scrollLeft+"px";
element.style.top = e.clientY+scrollTop+"px";
*/
  • offsetX //鼠标在触发事件的元素内的X坐标
  • offsetY //鼠标在触发事件的元素内的Y坐标
  • screenX // 鼠标指针相对于物理屏幕的X坐标
  • screenY // 鼠标指针相对于物理屏幕的Y坐标

KeyboardEvent

https://developer.mozilla.org/zh-CN/docs/Web/API/KeyboardEvent

  • keyCode 48-57 96-105为0-9数字code
  • charCode 返回 ascii码 keypress 按下字符键,更适用于使用 charCode(字符码),而不是keyCode 参考11分
  • altKey 如果在生成按键事件时<Alt ( 或 OS X 的 Option) 处于活动状态,则返回一个 Boolean

相关文章

  • event 事件对象

    event 对象及使用 event 对象是什么? event 对象表示事件的状态,当 dom 树中某个事件被触发时...

  • 20-第二十章 event对象 阻止冒泡 注册/ 移除监听事件

    一、事件event对象 Event 对象 /ɪ'vent/ 事件用来获取事件的详细信息:鼠标位置、键盘按键 主...

  • DOM事件(二)

    一、 事件对象 1.1 DOM中的事件对象 在触发DOM上的某个事件时,会产生一个事件对象event: event...

  • 事件对象

    事件对象 事件对象特点: 只有在事件处理程序执行期间,event对象才存在,一旦事件处理程序执行完成,event对...

  • 18、事件对象

    事件:用户的行为 事件对象 event : 储存[描述]了事件更详细的信息. 事件对象就是event,类似一个盒子...

  • 第七课 js事件

    event事件对象 1、什么是event事件对象? 用来获取事件的详细信息:鼠标位置、键盘按键 ——例子:获取鼠标...

  • js事件

    event事件对象 1、什么是event事件对象? 用来获取事件的详细信息:鼠标位置、键盘按键 ——例子:获取鼠标...

  • 事件对象

    事件对象 event(e) 当DOM操作触发某个事件时,会产生事件对象event当事件被触发时产生,事件执行完毕时...

  • 事件对象和事件委托

    事件对象事件发生的详细信息 在ie和chrome 事件详细信息保存到内置的 event对象中Event 对象代表事...

  • Day11 event事件(上)

    event(事件对象)概念及作用 在触发DOM上某个事件时,会产生一个事件对象event,这个对象包含着所有事件相...

网友评论

      本文标题:event事件对象

      本文链接:https://www.haomeiwen.com/subject/whnlactx.html