美文网首页Vue.js学习
移动端web界面click时间300s延迟的问题

移动端web界面click时间300s延迟的问题

作者: 泡芙小姐110 | 来源:发表于2016-12-14 15:16 被阅读51次

    众所周知 移动设备上web界面,click事件有300s的延迟,是因为。。。。。(很多巴拉巴拉)
    影响延迟主要是因为,事件响应的顺序是

    1. ontouchstart 当手指触摸手机屏幕时发生
    2. ontouchmove 当手指在屏幕上滑动时连续触发,通常我们在滑屏界面,会调用ever.preventDefault组织默认情况,防止页面滑动
    3. ontouched 当手指离开屏幕时触发
    4. click 点击事件

    所以如何解决移动端web界面事件延迟以及点击穿透方案?

    浏览器的开发商的解决方案

    方案一: 禁止缩放

    <meta name="viewport" content="user-scalable=no"/>
    <meta name="viewport" content="initial-scale=1,maximum-scale=1"/>

    方案二:更改默认的可视宽度

    <meta name="viewport" content="width=device-width"/>

    ** 第三方的解决方案**
    FastClick
    githup:https://github.com/ftlabs/fastclick/

    用法:

    1. 头部引入
    2. <script type="application/javascript">
      window.addEventListener('load', function () {
      FastClick.attach(document.body);
      }, false);
      </script>

    结束语:当然不止这些解决办法,但足够自己用了。待完善~~~

    相关文章

      网友评论

        本文标题:移动端web界面click时间300s延迟的问题

        本文链接:https://www.haomeiwen.com/subject/yzyimttx.html