这个fastclick是不是主要是消除是什么click 300ms延迟？

我实验过了几个例子，发现这个fastclick只能让页面上的元素在被点击的时候，才会有消除300ms的延迟，而如果是点击网页的空白处，依然会出现300ms的延迟，想知道这是什么原因？这个300ms的延迟到底消除的是什么？

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <!-- <meta name="viewport" content="width=device-width, initial-scale=1.0"> -->
  <title>Document</title>
  <style>
    .rect{
      width: 200px;
      height: 200px;
      background-color: red;
    }
  </style>
</head>
<body>
  <div id="rect" class="rect"></div>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/fastclick/1.0.6/fastclick.min.js"></script>
  <script>
    if ('addEventListener' in document) {
      document.addEventListener('DOMContentLoaded', function() {
        FastClick.attach(document.body);
        var startTime = '';
        document.addEventListener('touchstart', start);
        document.addEventListener('click', end);
        rect.addEventListener('click', end);
        function start(){
          startTime = new Date;
          console.log("touchstart");
        }
        function end(){
          console.log("click");
          console.log(new Date - startTime);
        }
      }, false);
      
    }
  </script>
</body>
</html>

慕移动3569406 2020-04-07

源自：移动常见问题 2-5 click300ms延迟

收起

3回答

好帮手慕星星回答被采纳获得+3积分 2020-04-08 10:03:23

同学你好，问题解答如下：

1、FastClick.attach();函数参数可以是页面中指定部分元素

2、非常感谢同学的建议，已经反馈给相关部分，会结合大家的建议进行综合考量，对大家有帮助的建议肯定会采纳的！

祝学习愉快！

收起回答

好帮手慕星星 2020-04-07 19:37:54

同学你好，是为了消除移动设备上的浏览器用户点击屏幕大约300毫秒的延迟。代码中添加在了

document.body上，但是body高度并不是视口的高度，是内容撑起来的高度，所以点击元素下面空白地方的时候，还会有延迟，点击元素右侧空白部分是没有延迟的。

自己可以再测试，或者给body设置固定高度测试。

祝学习愉快！

收起回答

提问者慕移动3569406 #1

嗯嗯，确实是这样，感谢！因为fastclick好像没有相关的文档，有一些理解需要证实一下： FastClick.attach(); 这个attach函数，里面传递的参数是不是用来指定页面上需要消除300ms延迟的部分？我实验了一下好像是这样没错。还有一个小小的建议，就是觉得有些时候，因为问题上描述的问题，好像助教们不能够清楚理解我的意思，觉得可能是一些自己的发问方式上出了问题，毕竟我们学员是寻求问题答案的一方，如果学员的表达方式有问题，那助教就很难给予满意的答案，所以学员自己的提问能力和艺术很重要，说”助教老师们希望看到的提问方式是什么”很重要，慕课网可以将这些提问原则写出来，让学员知道应该怎么发问。学员们有的可能是转行的，有的可能是专业的应届毕业生，各有各的性格，处于不一样的世界，沟通方式会有不一样，如果能够“统一口径”的发问，相信能够节省助教和学员之间的沟通成本。

2020-04-07 20:33:51
提问者慕移动3569406 #2

嗯嗯，确实是这样，感谢！因为fastclick好像没有相关的文档，有一些理解需要证实一下： FastClick.attach(); 这个attach函数，里面传递的参数是不是用来指定页面上需要消除300ms延迟的部分？我实验了一下好像是这样没错。还有一个小小的建议，就是觉得有些时候，因为问题上描述的问题，好像助教们不能够清楚理解我的意思，觉得可能是一些自己的发问方式上出了问题，毕竟我们学员是寻求问题答案的一方，如果学员的表达方式有问题，那助教就很难给予满意的答案，所以学员自己的提问能力和艺术很重要，或者说”助教老师们希望看到的提问方式是什么”很重要，慕课网可以将这些提问原则写出来，让学员知道应该怎么发问。学员们有的可能是转行的，有的可能是专业的应届毕业生，各有各的性格，处于不一样的世界，沟通方式会有不一样，如果能够“统一口径”的发问，相信能够节省助教和学员之间的沟通成本。

2020-04-07 20:35:09