(function(){
var extendEventDefaultOpt={
    touchdrag:{
        preventDefault:true,//阻止触摸移动的默认行为
        allowMultiTouch:false//允许在多点触控时也触发这个事件
    }
}
window.extendEvent={//扩展事件
    touchdrag:function(element,opt){
        var stats={},opt=Object.assign({},extendEventDefaultOpt.touchdrag,opt);
        element.addEventListener('touchstart',function(e){
            if(!opt.allowMultiTouch && e.changedTouches.length>1){stats={};return;}
            var ct=e.changedTouches;
            for(var t=ct.length;t--;){
                stats[ct[t].identifier]={x:ct[t].clientX,y:ct[t].clientY};
            }
        });
        element.addEventListener('touchmove',function(e){
            if(!opt.allowMultiTouch && e.touches.length>1){stats={};return;}
            var ct=e.changedTouches;
            for(var t=ct.length;t--;){
                var id=ct[t].identifier;
                if(!id in stats)continue;//不属于这个元素的事件
                var event=new TouchEvent('touchdrag',e);
                event.deltaX=ct[t].clientX-stats[id].x;
                event.deltaY=ct[t].clientY-stats[id].y;
                stats[id].x=ct[t].clientX;
                stats[id].y=ct[t].clientY;
                element.dispatchEvent(event);
            }
            if(opt.preventDefault)e.preventDefault();
        });
        element.addEventListener('touchend',function(e){
            var ct=e.changedTouches;
            for(var t=ct.length;t--;){
                var id=ct[t].identifier;
                if(id in stats)delete stats[id];
            }
        });
    }
}
})();

这是一个自定事件，在其Event对象上会带有deltaX和deltaY两个属性以表示触摸拖动的偏移量。

用法是

extendEvent.touchdrag(元素,选项Object) //在元素上启用这个自定义事件

选项object的属性见上面源码里 extendEventDefaultOpt 对象的两个属性。

然后当手指在元素上拖动的时候就会触发touchdrag事件。