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


     事件对象(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)
                        }
                    }
    集思广益,仅供学习,侵权即删!!
  • 相关阅读:
    [论文阅读笔记] A Multilayered Informative Random Walk for Attributed Social Network Embedding
    [论文阅读笔记] Large-Scale Heterogeneous Feature Embedding
    [论文阅读笔记] Community-oriented attributed network embedding
    微信小程序下拉选择器(反UI的产品设计)
    浮点数
    Centos7利用rpm升级OpenSSH到openssh-8.1p1版本
    CentOS7.6使用you-get下载视频素材
    mysql5.7以后group by 报错 sql_mode=only_full_group_by的解决方法
    【MySQL】Mysql提示:Out of sort memory, consider increasing server sort buffer size
    【Python】Windows系统安装pip.whl
  • 原文地址:https://www.cnblogs.com/hudunyu/p/11684182.html
Copyright © 2020-2023  润新知