移动WEBtouch事件遇到的坑
今天受命修改一个WEB端网页在手机端的适配问题。
该页面使用了scrollify.min.js这个js插件,在看插件的源代码是发现有一段
var m={touches:{touchstart:{y:-1},touchmove:{y:-1},touchend:false,direction:"undetermined"},options:{distance:30,timeGap:800,timeStamp:(new Date).getTime()},touchHandler:function(e){var t;if(typeof e!"undefined"){e.preventDefault();
if(typeof e.touches!"undefined"){t=e.touches[0];switch(e.type){case"touchstart":console.log('13');m.options.timeStamp=(new Date).getTime();m.touches.touchend=false;case"touchmove":m.touches[e.type].y=t.pageY;if(m.options.timeStamp+m.options.timeGap<(new Date).getTime()&&m.touches.touchendfalse){m.touches.touchend=true;if(m.touches.touchstart.y>-1){if(Math.abs(m.touches.touchmove.y-m.touches.touchstart.y)>m.options.distance){if(m.touches.touchstart.y<m.touches.touchmove.y){if(u>0){u--}d(u)}else{if(u<i.length-1){u++}d(u)}}}}break;case"touchend":if(m.touches[e.type]false){m.touches[e.type]=true;if(m.touches.touchstart.y>-1){if(Math.abs(m.touches.touchmove.y-m.touches.touchstart.y)>m.options.distance){if(m.touches.touchstart.y<m.touches.touchmove.y){if(u>0){u--}d(u)}else{if(u<i.length-1){u++}d(u)}}}};default:break}}}},init:function(){if(n.addEventListener){n.addEventListener("touchstart",m.touchHandler,false);n.addEventListener("touchmove",m.touchHandler,false);n.addEventListener("touchend",m.touchHandler,false)}}};
这段代码的大概意思是接替全部的touch事件,并阻止事件冒泡。这也不是重点,重点是我在查找资料之后发现,touch事件相应在clicl事件之前这就比较烦了。谁能想到呢?反正作为没有多少js开发经验的我来说是想不到的。
只要把e.preventDefault()注销掉就好了。
浙公网安备 33010602011771号