我已经编写了以下JavaScript代码。我正在使用它来检测鼠标何时移动以及何时停止。MouseStopped（）函数是一个包含数百个项目的循环，它将告诉我鼠标在哪里停止，因此我只想在鼠标停止时调用它。
var CheckMovement;
var stopLoop = false;
var n = 0;
canvas.addEventListener('mousemove', function (evt) {
CheckMovement = setInterval(function () { HasMouseStopped(evt) }, 250);
}, false)
function HasMouseStopped(evt) {
var mousePos = getMousePos(canvas, evt);
newMouseX = mousePos.x;
newMouseY = mousePos.y;
if ((newMouseX !== mouseX) && (newMouseY !== mouseY)) {
stopLoop = true;
} else {
//stopped moving
clearInterval(CheckMovement);
stopLoop = false;
n = 0;
MouseStopped();
}
mouseX = newMouseX;
mouseY = mousePos.y;
}
function MouseStopped() {
while (arr.length > n) {
if (stopLoop) { break; }
if (ctx.isPointInPath(mouseX, mouseY)) {
//tooltip text
ctx.font = '12pt Candara';
ctx.fillStyle = 'black';
ctx.fillText(arr[n], mouseX + 10, mouseY - 5);
break;
}
n++;
}
}
现在我有以下问题：
clearInterval(CheckMovement)，它也不会停止迭代；它连续运行，从而导致MouseStopped()多次调用的问题。为什么不停止？MouseStopped()如果要在完成循环之前移动鼠标，我想在它的操作过程中进行介绍。这就是我要设置的原因，stopLoop = true;但是，这似乎也没有按预期工作。如何实现这些目标？谢谢。
编辑
这非常简单：移动鼠标时，请将超时设置为XXX毫秒。另外，清除所有过去的超时以重置时间。像在mousemove监听器中这样
clearTimeout(timer);
timer=setTimeout(mouseStopped,300);
看到这个JSFiddle。
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句