js双击屏幕回到顶部？

Question

想请教一下，一般类似于微信那样的，双击屏幕回到顶部是怎么做的呀？

Answer 1

// 原生JS、PC端可以在`body`上添加双击事件
document.addEventListener('dblclick', function(){
    window.scrollTo(0, 0);
});

// 移动端双击不起作用。
// 可以用单击事件模拟
var touchTime = Date.now();
function handleClick(){
    if( Date.now() - touchTime < 800 ){
         window.scrollTo(0, 0);
    }else{
        //如果第二次点击在第一次点击0.8秒后，
        //则第二次点击默认为下一次双击判断的第一次点击
        touchTime = Date.now();
    }
}
document.addEventListener('click', handleClick);

参考移动手机端不能触发jQuery双击事件dblclick解决方法，
双击事件dblclick在移动端不起作用？
可以直接用chrome的移动端模拟测试效果。

Answer 2

可以给body写个双击事件，然后scrollTop（0）

Answer 3

首先回到顶部一般情况都采用悬浮回到顶部的方式，原因是微信头部的点击我们监听不到，而内容区域是明感区域，有可能和我们自定义的一些事件发生冲突。就问题而言，双击屏幕回到顶部，其实关键是移动端双击事件：
移动端要支持双击事件必然会让单击事件有延迟，所以移动端大多使用tap代替click，因为click会有300ms的延迟。。。如果项目用有使用zepto.js，它里面有一个双击事件：doubleTap 。