解决移动端点击事件延迟300ms的问题

我们都知道移动端有双击放大页面, 为了能监听点击是否为双击， 在单击后会等待下一次单击来完成双击， 那我们只要单击的时候，就会延迟300ms才会触发单击事件，这里我写了一个扩展jquery的mpclick事件，兼容pc和移动端，
专门解决移动端上点击延迟， 当然你也可以使用hammer.js，效果也很好, 使用之前请先引入jquery

;(function($) {
/**
* 兼容移动端和pc端的点击事件
* @type {{setup: Function, teardown: Function}}
*/
$.event.special.mpclick = {
setup: function () {
var reg = /Android|ip(hone|ad|od)|Windows Phone|SymbianOS/gi;
if(!reg.test(navigator.userAgent)) {
$(this).click(function() {
$(this).trigger("mpclick")
})
} else {
var startpoint = {x: 0, y: 0};
$(this).bind("touchstart", function(e) {
e = e || window.event
startpoint.x = Math.ceil(e.originalEvent.targetTouches[0].pageX);
startpoint.y = Math.ceil(e.originalEvent.targetTouches[0].pageY);
});
$(this).bind("touchend", function(e) {
e = e || window.event
var x = Math.ceil(e.originalEvent.changedTouches[0].pageX );
var y = Math.ceil(e.originalEvent.changedTouches[0].pageY );
if(x == startpoint.x && y == startpoint.y) {
$(this).trigger("mpclick");
}
e.preventDefault();
})
}
},
teardown: function (namespaces) {
$.event.remove(this, 'click');
$.event.remove(this, 'mpclick');
$.event.remove(this, 'touchstart');
$.event.remove(this, 'touchend');

}
};
$.fn.mpclick = function (callback) {
return callback ? this.bind("mpclick", callback) : this.trigger("mpclick");
};

})(jQuery, window, document)

绑定 $(".testClass").mpclick(function(){}) 或者 $(".testClass").bind("mpclick", function(){}) .....

触发
$(".testClass").mpclick() 或者
$(".testClass").trigger("mpclick")

好了， 希望你帮到你