(首先，让我说这个代码在我的github存储库中：点击这里)
存储库应为您提供问题所在所需的所有线索，但是如果您要打开index.html文件并单击，则应从左上角开始一个计数器。它似乎可以完美地工作一段时间，但是如果您单击很多并拖动鼠标并在页面上移动它一会儿，计数器会突然变得疯狂并快速计数。
我找不到这样做的代码的问题在哪里;我给了setInterval()一个特定的时间来更新timer，但是在移动鼠标、一堆点击和拖动鼠标等之后......计数器发疯了。通常这不会是一个太糟糕的问题，但是我正在实现此站点需要大量点击和鼠标移动。
我的下一个问题是我找不到一种方法来停止指望mouseup.目前，当鼠标向下或向上时，计数器计数。但是，我希望它在按住左键单击时开始计数，并在我离开左键单击时停止。我已经尝试了像while (mouseDown === true) ...这样的while循环，但无法正确加载页面。
任何帮助不胜感激！
let mouseDown = false;
let delta;
let isDragging = false;
var mY = 0;
//var currSpeed = $(document).cursometer('getCurrentSpeed');
let hello;
let timer = 0;
let pastTime;
let speed;
function collTime() {
timer += 1
$("#class").text(timer)
mouseDown = false;
}
$( document )
.mousedown(function() {
isDragging = false;
mouseDown = true;
var cancel = setInterval(collTime, 1000)
})
.mouseup(function() {
isDragging = false;
mouseDown = false;
timer = timer
})<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script></head>
<body>
<div id="class">
</div>
<script src="script.js"></script>
</body>
</html>每次点击都会调用setInterval()，但从不清除前一次。如果我单击 10 次，现在是 10 个并发间隔。
如果您declare根取消其余变量，则可以从点击事件中访问它。这允许您在重置之前将其清除。
let cancel;
clearInterval(cancel);
cancel = setInterval(collTime, 1000)
let cancel; //Cancel is now global
let mouseDown = false;
let delta;
let isDragging = false;
var mY = 0;
let hello;
let timer = 0;
let pastTime;
let speed;
function collTime() {
timer += 1
$("#class").text(timer)
mouseDown = false;
}
$(document)
.mousedown(function() {
isDragging = false;
mouseDown = true;
clearInterval(cancel); //Remove the previous timer
cancel = setInterval(collTime, 1000) //Create a new one
})
.mouseup(function() {
isDragging = false;
mouseDown = false;
timer = timer
});<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
</head>
<body>
<div id="class">
</div>
<script src="script.js"></script>
</body>
</html>