移动页面【点击穿透】问题
1. click事件与300s延迟
移动浏览器，用户触碰页面之后需等待一段时间来判断是不是（double Tap）动作，而不是立即响应单击（click），响应时间为300ms。
移动事件提供了 touchstart、 touchmove、 touchend 却没有提供tap支持 ，主流框架（库）都是手动实现自定义tap事件来消除300ms延迟，提高页面响应速度。
注意：简单页面，touchstart或touchmove可当做tap来用，但存在问题：手指接触目标元素，按住不放，慢慢移除响应区域，会触发touchstart事件执行对应的事件处理器（本不该触发。）， touchend 也存在类似问题。
2.点击穿透问题
1） 点击穿透 问题
点击蒙层(mask)上的关闭按钮，蒙层消失后触发了按钮下面元素的click事件。
2）跨页面点击穿透 问题
按钮下面是href 属性的a标签，页面也会发生跳转，与上面相同原理。
3）另一种跨页面点击穿透 问题
没有mask，直接点击页内按钮跳转至新页，然后新页面对应元素的click事件被触 发。
3.解决方案
1）不要混用touch和click;
既然touch之后300ms会触发click,只用touch或者只用click就自然不会存在问题。
①只用touch [简单完美]
把所有click换成touch事件（touchstart,touchend,tap）
注意：<a>标签的href也是click,需要去掉换成js控制的跳转；
或者直接改成span+tap 控制跳转，
如果要求不高，可以span+touchend就可以。
不用<a>标签其实没关系，移动app开发不用考虑SEO。
②只用click[不建议]
2）消费掉touch之后的click。
拿东西挡住；tap后延迟30ms再隐藏mask,pointe-revents;在下面元素的事件处理器里做检测（配合全局flag）等。
①拿东西挡住[蠢萌不建议]
②tap后延迟350ms再隐藏mask[省力]
优点：改动小，只改mask；
缺点：隐藏mask变慢
③pointer-event[麻烦不建议]
④在下面元素的事件处理器里做检测（配合全局flag）[麻烦不建议]
⑤fastclick[不如第一种]
引入fastclick库；把页面所有touch换成click
1. click事件与300s延迟
移动浏览器，用户触碰页面之后需等待一段时间来判断是不是（double Tap）动作，而不是立即响应单击（click），响应时间为300ms。
移动事件提供了 touchstart、 touchmove、 touchend 却没有提供tap支持 ，主流框架（库）都是手动实现自定义tap事件来消除300ms延迟，提高页面响应速度。
注意：简单页面，touchstart或touchmove可当做tap来用，但存在问题：手指接触目标元素，按住不放，慢慢移除响应区域，会触发touchstart事件执行对应的事件处理器（本不该触发。）， touchend 也存在类似问题。
2.点击穿透问题
1） 点击穿透 问题
点击蒙层(mask)上的关闭按钮，蒙层消失后触发了按钮下面元素的click事件。
2）跨页面点击穿透 问题
按钮下面是href 属性的a标签，页面也会发生跳转，与上面相同原理。
3）另一种跨页面点击穿透 问题
没有mask，直接点击页内按钮跳转至新页，然后新页面对应元素的click事件被触 发。
3.解决方案
1）不要混用touch和click;
既然touch之后300ms会触发click,只用touch或者只用click就自然不会存在问题。
①只用touch [简单完美]
把所有click换成touch事件（touchstart,touchend,tap）
注意：<a>标签的href也是click,需要去掉换成js控制的跳转；
或者直接改成span+tap 控制跳转，
如果要求不高，可以span+touchend就可以。
不用<a>标签其实没关系，移动app开发不用考虑SEO。
②只用click[不建议]
2）消费掉touch之后的click。
拿东西挡住；tap后延迟30ms再隐藏mask,pointe-revents;在下面元素的事件处理器里做检测（配合全局flag）等。
①拿东西挡住[蠢萌不建议]
②tap后延迟350ms再隐藏mask[省力]
优点：改动小，只改mask；
缺点：隐藏mask变慢
③pointer-event[麻烦不建议]
④在下面元素的事件处理器里做检测（配合全局flag）[麻烦不建议]
⑤fastclick[不如第一种]
引入fastclick库；把页面所有touch换成click