首页 > 移动平台 > 详细

移动端点击事件

时间:2017-09-30 19:22:28      阅读:298      评论:0      收藏:0      [点我收藏+]


if (!HTMLElement.prototype.addTapEvent) {
HTMLElement.prototype.addTapEvent = function(callback) {
var tapStartTime = 0,
tapEndTime = 0,
tapTime = 500, //tap等待时间,在此事件下松开可触发方法
tapStartClientX = 0,
tapStartClientY = 0,
tapEndClientX = 0,
tapEndClientY = 0,
tapScollHeight = 15, //水平或垂直方向移动超过15px测判定为取消(根据chrome浏览器默认的判断取消点击的移动量)
cancleClick = false;
this.addEventListener(‘touchstart‘, function() {
tapStartTime = event.timeStamp;
var touch = event.changedTouches[0];
tapStartClientX = touch.clientX;
tapStartClientY = touch.clientY;
cancleClick = false;
})
this.addEventListener(‘touchmove‘, function() {
var touch = event.changedTouches[0];
tapEndClientX = touch.clientX;
tapEndClientY = touch.clientY;
if ((Math.abs(tapEndClientX - tapStartClientX) > tapScollHeight) || (Math.abs(tapEndClientY - tapStartClientY) > tapScollHeight)) {
cancleClick = true;
}
})
this.addEventListener(‘touchend‘, function() {
tapEndTime = event.timeStamp;
if (!cancleClick && (tapEndTime - tapStartTime) <= tapTime) {
callback();
}
})
}
}

 

//调用

element.addTapEvent(function(){})

移动端点击事件

原文:http://www.cnblogs.com/zengqingsen/p/7615598.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!