Javascript requestAnimationFrame正在传递IE10中的意外参数

因此，我一直是一个好的网络公民，使用功能检测来查看浏览器是否支持

requestAnimationFrame

，否则只能退回到基于

setTimeout

的解决方案（类似的解决方案）

var NOW=Date.NOW | |函数（）{return new Date.getTime（）；}；
无功补偿框架=
window.requestAnimationFrame||
window.webkitRequestAnimationFrame||
/*                        ... ||                     */
函数（回调）{
setTimeout（函数（）{callback（NOW（））；}，1000/60）；
};
var previousTime=NOW（）；
功能步骤（时间）{
var timePassed=时间-以前的时间；
myCharacter.move（myCharacter.speed*timePassed）；
以前的时间=时间；
reqAnimationFrame（animStep）；
} 
//启动动画
reqAnimationFrame（animStep）；

在InternetExplorer10出现之前，这在任何地方都非常有效。在IE10中，传递的

time

参数似乎与当前时间没有任何关系，从而导致

timePassed

的计算出错

发生了什么事？

所有（据我所知）实现

requestAnimationFrame

的其他浏览器都符合当前（撰写本文时）的规范：

设时间为[重绘时间]，表示为自1970-01-01T00:00:00Z以来的毫秒数

这与您的

NOW（）

所表示的时间完全相同

然而，根据当前的规范，IE10：

让时间成为在此上下文中调用的结果

这实际上意味着浏览器加载此页面后的毫秒数（也意味着测量更精确，因为

性能。现在
返回分数毫秒）

因此，当你在IE10中第一次计算
timePassed
时，你得到的是负43年

幸运的是，由于传递给
requestAnimationFrame
回调的值在两种情况下都具有相同的单位，只是不同的参考点，因此您可以轻松地进行调整

有三种可能性：

您可以扔掉第一个动画步骤，只使用它设置
previousTime
，而不做任何其他操作
您可以忽略传递的参数，每次都使用
NOW（）
（或
performance.NOW
），因此始终具有相同的参考点
或者可以将动画的开始更改为：

//启动动画
reqAnimationFrame（函数（t）{
previousTime=t-（现在（）-previousTime）；
步骤（t）；
);

这将使
timePassed
的计算（包括第一次）正确无误，无论浏览器遵循哪种规范。而且，由于它只更改第一次调用，因此从长远来看，您也不会有任何额外的开销

非常令人惊讶的是…这将是Internet Explorer第一次偏离规范。我很震惊！@jAndy好吧，在这种情况下，你可以说他们在遵循它方面领先于其他浏览器。这正是问题的关键：IE多年来一直处于混乱状态，现在他们正努力成为严格遵守标准的好人。希望它能做到我将来会平衡的。