Question

我正在阅读这个javascript教程： http://www.switchonthecode.com/tutor...ccordion-menus 基本上，它向您展示了如何使用纯javascript创建手风琴，而不是jquery。在跟踪动画的实际部分之前，一切都对我有意义。他说：“因为这一切，我们在动画功能中做的第一件事是弄清楚自上次动画迭代以来已经过了多少时间。” 然后使用此代码：代码：

var elapsedTicks = curTick - lastTick;

lastTick等于函数调用时的值（Date（）。getTime（）），curTick等于接收函数时的值。我不明白为什么我们在这里从另一个中减去一个。我无法想象这两个值之间有任何明显的时差。或者也许我错过了什么。这个animate（）函数是每次单击一个菜单标题时调用一次还是多次调用以创建增量动画效果？

setTimeout("animate(" + new Date().getTime() + "," + TimeToSlide + ",'" + openAccordion + "','" + nID + "')", 33);

感谢您的回复。

Answer 1

lastTick等于函数调用时的值

lastTick等于函数在动画的最后一帧之前调用时的值。从那以后，脚本将控制权交还给浏览器，要求在33毫秒内回调。

所以curTick-lastTick通常约 33，但如果浏览器由于同时发生的其他事情而滞后，则可能会高得多。这就是必须要进行时间阅读的原因。

通常在这种代码中，您将动画开始的时间存储在变量中，并使用setInterval每隔一段时间检查一次，而不是设置完整的每次都有新的超时功能（特别是从字符串设置超时，这是非常丑陋的）。

ETA：

然后运行animate（）函数，该函数传递当前时间

不。再看一下set-timeout调用：

setTimeout("animate(" + new Date().getTime() + ","...

那是一个字符串。在超时设置时评估new Date().getTime()，在超时调用时不。它最终会形成如下字符串：

setTimeout("animate(1275139344177, 250, 'Accordion4Content', 'Accordion4Content')", 33)

最后一帧结束时的时间，而不是下一帧超时的时间。

将JavaScript代码放在这样的字符串中是非常混乱的，充斥着逃避问题，并且通常被认为是非常糟糕的做法。使用内联函数更清楚：

var passTick= new Date().getTime();
setTimeout(function() {
    animate(passTick, TimeToSlide, openAccordion, nID);
}, 33);

javascript手风琴 - 跟踪时间问题

1 个答案: