Javascript 如何测量mousedown和mouseup之间的毫秒数？

有没有办法测量鼠标按下和释放之间的毫秒数？

您可以使用两个全局变量来记录mousedown和mouseup的时间，并有一个减法

您可以创建一个闭包来共享两个变量，一个用于存储开始时间，另一个用于存储结束时间，然后在mouseup事件中，获得差异：

(function () {
    var element = document.getElementById('element'),
        start, end;

    element.onmousedown = function () {
      start = +new Date(); // get unix-timestamp in milliseconds
    };


    element.onmouseup = function () {
      end = +new Date();

      var diff = end - start; // time difference in milliseconds
    };

})();

---

检查此工作。

当启动onmousedown时，您可以在窗口上挂起onmouseup事件。这样可以避免不必要的关闭

el.onmousedown = function () {
  var time = new Date(); //time in milliseconds
  window.onmouseup=function(){
    var diff=new Date()-time;
    window.onmouseup=null;
  }
};

此处检查结果：

tl；dr.答案和示例

• 通过从第二个事件的

  .timeStamp

  属性中减去第一个事件的属性来获取两个事件之间的时间
• 不要试图通过在事件处理程序中创建

  new Date（）

  或调用

  Date.now（）

  来获取事件发生的时间
• 请注意，即使遵循此建议，在某些浏览器的旧版本中，如果事件处理程序的执行因某些不相关JavaScript的缓慢执行而延迟，也会得到错误的结果

const-button=document.getElementById（“按钮”）；
让鼠标下移；
button.addEventListener（'mousedown'，（）=>{
mousedownTime=newdate（）.getTime（）；
});
addEventListener（'mouseup'，function（）{
const mouseupTime=new Date（）.getTime（），
时差=mouseupTime-mousedownTime；
警报（${timeDifference}ms`按下按钮）；
});
单击我
由于其他链接现在似乎已断开，至少在chrome上是这样，下面是一个简单的工作演示：


var开始时间；
window.startTimer=函数（）{
开始时间=新日期（）；
}
window.reportTime=函数（）{
警报（新日期（）-startTime）
}
测量点击时间
我认为这是最优雅的方式：

 function onMouseDown(e) {
    window.onmouseup = function(e2) {
      var diff = e2.timeStamp - e.originalEvent.timeStamp;
      console.log(diff);
      window.onmouseup = null;
    };
  }

new Date（）
之前的
+
有什么作用？@jsoldi:它只是进行类型转换（到数字），有关详细信息，请参见以下答案：如果浏览器支持它，
Date.now（）
将比实例化日期对象更好。但并非所有浏览器都会这样做。我不太想对它抛出-1，但我要说的是，通过创建
新日期（）
来获取事件发生的时间通常是一种不好的做法。请阅读事件的
.timeStamp
属性，这样（至少在某些浏览器中）当事件发生时，如果您的一个或两个事件处理程序由于其他JavaScript正在执行而最终排队，则您的计时不会出现偏差。请参阅我的答案（），了解更多关于这一点的内容，并附上示例。@混淆Mr__C，以便
元素
、
开始
、和
结束
名称不会泄漏到全局范围中。-1表示“避免不必要的闭包”（为什么？！），紧接着是使用闭包的代码段。