码迷,mamicode.com
首页 > 编程语言 > 详细

前端随心记---------Javascript系列(第十一节.事件event)

时间:2019-10-17 00:49:56      阅读:128      评论:0      收藏:0      [点我收藏+]

标签:box   事件   set   span   doc   document   lse   OLE   默认   

 事件对象(event)

事件 : 对某个元素的某种操作
事件对象: 当触发某个事件,产生的对象。就是事件对象,event使用的前提,必须有事件操作 var e=e || event ;

坐标属性:
pageX /pageY 相对于文档顶部和左侧的坐标 ie8为undefined;
clientX /clientY 相对于document窗口的顶部和左侧的坐标,如果出现滚动条,pageY=clienY+页面滚动的距离
offsetX /offsetY 相对于操作的元素内部偏移量
var disx=e.offsetX || e.layerX//layerX:火狐
var disx=e.offsetY || e.layerY//layerY:火狐使用

 

鼠标事件对象的button属性
button 控制用户按键
左键:0
滚轮:1
右键:2
ie下的按键
左键:1
滚轮:4
右键:2

 鼠标的兼容:

document.onmousedown = function(eve){
            var e = eve || event;
            var button = getButton(eve);
            console.log(button);    
                }
     function getButton(eve){
            //如何判断是ie8浏览器
            //根据事件对象来判断
            if(eve){
                return eve.button;
            }else{
                //这里是ie8执行
                var button = window.event.button;
                switch(button){
                    case 1:
                      return 0;
                    case 4:
                      return 1;
                    case 2:
                      return 2; 
                }
            }
        }

 

键盘事件对象属性

keyCode
ctrlKey shiftKey altKey 功能按键,当键盘按下时会返回布尔值
默认回车键的keyCode值是13,

例如用法:

  document.onkeydown = function(eve){
            var e = eve || event;
            var code = e.keyCode || e.which || e.charCode;
            var cVal = content.value;
            if(e.altKey && e.ctrlKey && code == 13){
                box.innerHTML += cVal + "<br>";}
                }

 


在onkeypress事件中,如果功能键ctrl+回车键,回车键的keyCode值为10在onkeypress事件中的ctrlKey和enter的组合键设置,.功能键属性一般不用于onkeypress。onkeypress这个事件下除了空格和回车键以外的其它功能键都不触发。
e.keyCode的兼容:
低版本的火弧中,onkeypress事件中e.keyCode值都为的0
火弧中使用e.which e.charCode
var code = e.keyCode || e.which || e.charCode;

例如用法:

  document.onkeypress = function(eve){
                    var e = eve || event;
                    var code = e.keyCode || e.which || e.charCode;
                    var cVal = content.value;
                    if(e.ctrlKey && code == 10){
                        box.innerHTML += cVal + "<br>";
                        //alert(1)
                    }
                }

 

前端随心记---------Javascript系列(第十一节.事件event)

标签:box   事件   set   span   doc   document   lse   OLE   默认   

原文地址:https://www.cnblogs.com/hudunyu/p/11684182.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!