jQuery触屏插件：Tap 代码分享

jQuery触屏插件：Tap，使用方法非常简单，例：
$("#domid").tap(function(){
  alert("You tapped me! -- by"+this.innerText);
});
依赖jquery 1.7+


01
$.fn.tap = function(fn){
02
    var collection = this,
03
        isTouch = "ontouchend" in document.createElement("div"),
04
        tstart = isTouch ? "touchstart" : "mousedown",
05
        tmove = isTouch ? "touchmove" : "mousemove",
06
        tend = isTouch ? "touchend" : "mouseup",
07
        tcancel = isTouch ? "touchcancel" : "mouseout";
08
    collection.each(function(){
09
        var i = {};
10
        i.target = this;
11
        $(i.target).on(tstart,function(e){
12
            var p = "touches" in e ? e.touches[0] : (isTouch ? window.event.touches[0] : window.event);
13
            i.startX = p.clientX;
14
            i.startY = p.clientY;
15
            i.endX = p.clientX;
16
            i.endY = p.clientY;
17
            i.startTime = + new Date;
18
        });
19
        $(i.target).on(tmove,function(e){
20
            var p = "touches" in e ? e.touches[0] : (isTouch ? window.event.touches[0] : window.event);
21
            i.endX = p.clientX;
22
            i.endY = p.clientY;
23
        });
24
        $(i.target).on(tend,function(e){
25
            if((+ new Date)-i.startTime<300){
26
                if(Math.abs(i.endX-i.startX)+Math.abs(i.endY-i.startY)<20){
27
                    var e = e || window.event;
28
                    e.preventDefault();
29
                    fn.call(i.target);
30
                }
31
            }
32
            i.startTime = undefined;
33
            i.startX = undefined;
34
            i.startY = undefined;
35
            i.endX = undefined;
36
            i.endY = undefined;
37
        });
38
    });
39
    return collection;
40
}