zoukankan      html  css  js  c++  java
  • JavaScript高级程序设计46.pdf

    鼠标按钮

    只有在主鼠标按钮被单击(或键盘回车键被按下)是才会触发click事件,对于mousedown和mouseup事件,其event对象存在一个button属性,表示按下或者释放按钮。DOM的button属性可能有3个值:0表示主鼠标按钮、1表示中间鼠标按钮、2表示次鼠标按钮

    IE8及之前版本也提供了button属性,这个属性的值与DOM的button属性有很大差异

    0:没有按下按钮

    1:按下主鼠标按钮

    2:按下次鼠标按钮

    3:同时按下主次鼠标按钮

    4:中间鼠标的按钮

    5:同时按下主鼠标按钮和中间鼠标按钮

    6:同时按下次鼠标按钮和中间鼠标按钮

    7:同时按下鼠标3个按钮

    将IE的其它选项转换为这三个按键的任意一个(主按钮作为优先选取的对象)

    var EventUtil={

          //省略了其它代码

          getButton:function(event){

              if(document.implementation.hasFeature("MouseEvents","2.0")){

                return event.button;

              }else{

                switch(event.button){

                    case 0:

                    case 1:

                    case 3:

                    case 5:

                    case 7:

                      return 0;

                    case 2:

                    case 6:

                      return 2;

                    case 4:

                      return 1;

                  }

              }

            },

          //省略了其它代码

        };

    更多的事件信息

    “DOM2级事件”规范在event对象中还提供了detail属性,用于给出有关事件的更多信息,对于鼠标事件来说,detail包含一个数组,表示给定位置上发生了多少次单击,在同一像素上相继发生一次mousedown和mouseup算做一次单击,detail属性从1开始计数,每次单击发生后都会递增,如果移动了位置,则detail会被重置为0;

    IE通过下列属性为鼠标事件提供了更多的信息

    altLeft:布尔值,表示是否按下了Alt键,如果altLeft的值为true,则altKey也为true

    ctrlLeft:布尔值,表示是否按下了Ctrl键,如果ctrlLeft的值为true,则ctrlKey也为true

    offsetX:光标相对于目标元素边界的x坐标

    offsetY:光标相对于目标元素边界的y坐标

    shiftLeft:布尔值,表示是否按下了Shift键,如果shiftLeft的值为true,则shiftKey也为true

    这些属性的用处并不大

    鼠标滚轮事件

    用户通过鼠标滚轮与页面交互时,就会触发mousewheel事件,这个事件可以在任何元素上触发,最终会冒泡到document(IE8)或window(IE9和其他现代浏览器,不包括firefox)

    mousewheel事件对于的event对象除包含鼠标事件的所有标准信息,还包含一个特殊的wheelDelta属性,当滚轮向前滚动时wheelDelta是120的倍数,反之是-120的倍数

    EventUtil.addHandler(document,"mousewheel",function(event){

            event=EventUtil.getEvent(event);

            alert(event.wheelDelta);

          });

    多数情况主要知道鼠标滚轮滚动方向就够了,需要注意的是在Opera9.5之前的版本中,wheelDelta值得正负号是颠倒的

    EventUtil.addHandler(document,"mousewheel",function(event){

            event=EventUtil.getEvent(event);

            var delta=(client.engine.opera && client.engine.opera<9.5 ? -event.wheelDelta : event.wheelDelta);

            alert(delta);

          });

    Firefox支持一个名为DOMMouseScroll的类似事件,也是在鼠标滚轮滚动时触发,DOMMouseScroll也包含于鼠标事件的所有属性,有关鼠标滚轮的信息保存在detail属性中,滚轮向前滚时,这个值是-3的倍数,向后滚时是3的倍数,可以将DOMMouseScroll添加到页面中的任何元素,该事件会冒泡到window对象

    EventUtil.addHandler(window,"DOMMouseScroll",function(event){

            event=EventUtil.getEvent(event);

            alert(event.delta);

          });

    将EventUtil对象完善

    var EventUtil={

          //省略了其他代码

          getWheelDelta:function(event){

              if(event.wheelDelta){

                  return(client.engine.opera && client.engine.opera<9.5 ? -event.wheelDelta : event.wheelDelta);

              }else{

                  return -event.detail*40;

              }

            },

          //省略了其他代码

        };

  • 相关阅读:
    Mayan游戏 (codevs 1136)题解
    虫食算 (codevs 1064)题解
    靶形数独 (codevs 1174)题解
    黑白棋游戏 (codevs 2743)题解
    神经网络 (codevs 1088) 题解
    The Rotation Game (POJ 2286) 题解
    倒水问题 (codevs 1226) 题解
    银河英雄传说 (codevs 1540) 题解
    生日蛋糕 (codevs 1710) 题解
    第一章 1.11 高阶函数
  • 原文地址:https://www.cnblogs.com/sdgjytu/p/3783089.html
Copyright © 2011-2022 走看看