IOS设备 引入fastclick后alert事件会出现点击延迟2000ms以上怎么破?

IOS设备引入fastclick后alert事件会出现点击延迟2000ms以上怎么破?

今天在写代码的时候,偶然间使用alert()进行调试,却发现alert响应特别迟钝。。大概2秒后才弹出
找了一下问题。。发现是我之前配置了 fastclick
在ios设备上当触发alert()事件时会有2000ms的响应延迟
安卓设备测试正常

IOS 10 测试环境:

当不引用fastclick时,使用原生点击事件 alert('弹出只需30ms')
当引用fastclick时,使用点击事件 onclick="alert('点击后延迟2000ms弹出')"
<!DOCTYPE html>
<html>

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"
  />
  <META HTTP-EQUIV="Pragma" CONTENT="no-cache">
  <META HTTP-EQUIV="Cache-Control" CONTENT="no-cache">
  <META HTTP-EQUIV="Expires" CONTENT="0">
  <title>IOS设备测试DEMO</title>
  <style>
    .topSlide {
      position: relative;
      background-color: blue;
      margin: auto;
      margin-top: 30px;
    }

    .topSlide p {
      text-align: center;
      font-size: 20px;
      line-height: 36px;
      color: white;
    }

    .result {
      position: relative;
      background-color: green;
      margin: auto;
      margin-top: 30px;
      color: white;
    }
  </style>

</head>

<body>
  <div id="t1" class="topSlide">
    <p>原生点击事件,无延迟alert()</p>
  </div>

  <div id="t2" class="topSlide">
    <p>使用fastclick调用alert()延迟2000ms以上</p>
  </div>
</body>

<script type="text/javascript" src="http://cdn.bootcss.com/jquery/2.1.4/jquery.min.js"></script>
<script src="http://cdn.bootcss.com/fastclick/1.0.6/fastclick.min.js"></script>
<script>
  $(function () {
    var me = $('#t2')[0];
    FastClick.attach(me);

    var mouseClick1 = function () {
      alert('基本无延迟弹出')
    };
    var mouseClick2 = function () {
      alert('IOS设备延迟2000ms弹出')
    };

    $('#t1').on('click', mouseClick1);
    $('#t2').on('click', mouseClick2);
  }); 
</script>

</html>
阅读 3.1k
2 个回答

有没有解决办法啊?

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进