zoukankan      html  css  js  c++  java
  • Event事件

    Event对象(事件源对象)代表事件的状态

      比如事件在其中发生的元素、键盘按键的状态、鼠标的位置、鼠标按钮的状态。

    btn.onmousedown = function(event){ //在w3c标准中,直接在函数中声明该参数即可
        
    console.log(event);   //这次点击事件的详细信息
    console.log(event.button);      //0 代表鼠标按下了左键,1代表按下了滚轮,2代表按下了右键。
    }
    
    注意:1.event对象是事件绑定中的一个隐藏的参数,可以通过arguments[0]来获取;
            2:老版本的并没有遵守w3c的规范,它的button属性含义如下:
                        1鼠标左键 2鼠标右键 3左右同时按 4滚轮 5左键加滚轮 6右键加滚轮 7三个同时

    兼容性写法,支持老版本的IE。

      btn.onmousedown = function(event){

    //var evt = event || window.event ;// 如果event是有效的话,则把event赋值给evt,否则把

    //window.event 赋值给evt; 

      console.log(event); // undefined;

      console.log(window.event); //event对象

    }

     // IE6时,function(event){ }这个event是找不到的,只能通过window查找event。

    clientX 、clientY

    在可视区域的位置,也就是浏览器坐标。

    鼠标在可视区域内的坐标。

    document.onmousemove = function(event){

    event = event || window.event;

    document.title = event.clientX+","+event.clientY;

    }

    演示:鼠标跟随的提示框。

    offsetX 、offsetY

    相对于事件源对象的偏移量,也就是元素的坐标,相对坐标。

    鼠标在某个对象上时,鼠标与该对象的左上角的间距坐标。

    div1.onmousemove = function(event){

    event = event ||window.event;

    document.title = event.offsetX+","+event.offsetY;

    }

    pageX、 pageY

    鼠标在整个页面上的坐标,计算滚动条距离。

    document.onmousemove = function(event){

    event = event || window.event;

    document.title = event.pageX+","+event.page.Y;

    }

    screenX、 screenY

    整个屏幕坐标,鼠标与当前电脑屏幕的间距。

    document.onmousemove = function (event){

    event = event || window.event;

    document.title = event.screenX+","+event.screenY;

    }

  • 相关阅读:
    Code Review 五问五答
    JavaScript 10分钟入门
    swagger editor使用
    Tyk API网关介绍及安装说明
    Castle 多继承选择
    线程信息的获取和设置
    s3 api接口的调用
    在Hadoop集群上的HBase配置
    OpenStack 单元测试
    在Hadoop集群上的Hive配置
  • 原文地址:https://www.cnblogs.com/l8l8/p/8759049.html
Copyright © 2011-2022 走看看