码迷,mamicode.com
首页 > Web开发 > 详细

关于js的addEventListener 和一些常用事件

时间:2015-10-13 19:07:42      阅读:270      评论:0      收藏:0      [点我收藏+]

标签:

document.addEventListener("touchstart", function(){}, true)

                addEventListener里最后一个参数决定该事件的响应顺序;


                如果为true事件执行顺序为 addEventListener ---- 标签的onclick事件 ---- document.onclick 

                如果为false事件的顺序为 标签的onclick事件 ---- document.onclick ---- addEventListener

 

鼠标事件
               

 document.addEventListener(‘mousedown‘, mouseDown);
 document.addEventListener(‘click‘, mouseClick);
 document.addEventListener(‘mouseup‘, mouseUp);

 


 touch事件
               

document.addEventListener(‘touchstart‘, touchStart);
document.addEventListener(‘touchend‘, touchEnd);

       // touchstart事件:当手指触摸屏幕时候触发,即使已经有一个手指放在屏幕上也会触发
       // touchmove事件:当手指在屏幕上滑动的时候连续地触发。在这个事件发生期间,调用preventDefault()事件可以阻止滚动

       // touchend事件:当手指从屏幕上离开的时候触发。
       // touchcancel事件:当系统停止跟踪触摸的时候触发。关于这个事件的确切出发时间,文档中并没有具体说明,只好去猜测
(在ios设备上的表现是常按着一段时间后自动结束touchstart事件的调用)

    

每个touch事件自带三个属性
     touches:表示当前跟踪的触摸操作的touch对象的数组。
     targetTouches:特定于事件目标的Touch对象的数组。
  changeTouches:表示自上次触摸以来发生了什么改变的Touch对象的数组
                
     每个touches 自带
         clientX:触摸目标在视口中的x坐标。
         clientY:触摸目标在视口中的y坐标。
         identifier:标识触摸的唯一ID。
         pageX:触摸目标在页面中的x坐标。
         pageY:触摸目标在页面中的y坐标。
         screenX:触摸目标在屏幕中的x坐标。
         screenY:触摸目标在屏幕中的y坐标。
         target:触目的DOM节点目标

 支持:

                iOs版Safari、Android版WebKit、bada版Dolfin、OS6+中的BlackBerry WebKit、Opera Mobile 10.1+和LG专有OS中的Phantom浏览器。目前只有iOs版Safari支持多点触摸。PC版Firefox 6+ 和Chrome也支持触摸事件

     代码实例1
               

var gotouch=function(){
       alert(‘touchstartok‘);
}

document.addEventListener("touchstart", gotouch);

//note: 第三个参数不写 默认为false 

public override function addEventListener(
type:String,
listener:Function,
useCapture:Boolean = false,
priority:int = 0,
useWeakReference:Boolean = false
):void

                  

       代码实例2
                 

 function Go(){   //...     }
 
document.getElementById("testButton").addEventListener("click", Go, false);

// 或者 listener 直接就是函数
document.getElementById("testButton").addEventListener("click", function () { ... }, false);
document.getElementById("testButton").removeEventListener("click", Go); // 删除监听事件

 

关于js的addEventListener 和一些常用事件

标签:

原文地址:http://www.cnblogs.com/isdom/p/webclips010.html

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