0

我在鼠标单击时调用以下代码：

clearTimeouts();
var inMotion = true, x = 0;
var shuffleTimer = setTimeout(function(){inMotion = false}, 3500);
var shuffleStart = setTimeout(oneShuffle, x);

function oneShuffle(){
    x+=5;
    if(inMotion === true){

        console.log('Shuffling again');

        //shuffle again
        shuffleStart = setTimeout(oneShuffle, x);

    } else {

        //increment spins
        spins++;

        //reset spins if loadOrder been exhausted
        spins === loadOrder.length ? spins = 0 : 0;

        console.log(spins);

    }
}

function clearTimeouts(){
   console.log('Clearing timeouts')
   clearTimeout(shuffleTimer);
   clearTimeout(shuffleStart);
}

应该发生的情况是，如果我单击元素，而inMotion两个true超时应该重置并且我的spins计数器不应该为上一次单击而增加。然而，相反的情况是，无论如何，旋转都会因先前的超时而增加。为什么？

4

2 回答 2

2

应该重置哪些计时器？如果您发布的代码位于单击处理程序中，则每次单击都会产生新的计时器。

这些行：

var shuffleTimer = setTimeout(function(){inMotion = false}, 3500);
var shuffleStart = setTimeout(oneShuffle, x);

每次都创建新的计时器，因此第一行 ( clearTimeouts();) 没有意义，因为计时器要到接下来的两行才会存在。

您应该将两个计时器都放在单击处理程序的范围之外，因此所有单击调用都将引用相同的计时器。此外，所有状态（inMotin、spins 等）都应该存在于函数范围之外，否则每次点击都会产生新的、不相关的变量。

于 2013-08-17T18:19:08.853 回答
0

你应该把 clearTimeouts() 放在你的 if 中，像这样：

if(inMotion === true){
    clearTimeouts();
    console.log('Shuffling again');

    //shuffle again
    shuffleStart = setTimeout(oneShuffle, x);

}
于 2013-08-17T18:23:40.290 回答