Chrome 没有执行 jQuery 动画回调中的所有行答案

【问题标题】：Chrome is not executing all lines in callback for jQuery animationChrome 没有执行 jQuery 动画回调中的所有行
【发布时间】：2012-06-01 02:47:01
【问题描述】：

我有一些代码可以为<div> 设置动画。动画完成后，有几件事需要发生（主要是对各种元素的 CSS 操作），所以我很自然地将它们放在 jQuery 的 .animate() 提供的回调中；

它在 Firefox 中的行为与预期一样。我无法判断这是否是 IE 中的问题，因为仍有一些 CSS 问题阻止它在那里正确显示 - 我无法判断它是 CSS 还是我在 Chrome 中遇到的相同问题。无论如何，目前我专注于 Chrome。

需要注意的一点是，如果我在未执行的行之前执行console.log，则不会发生这种情况。如果我插入一个断点然后让它继续，也是一样的。

        $sliders.animate($thisSlideConfig, 250, function() {

            $newPg.removeAttr('style');

            $curPg = $newPg;
            $curPgInf = plugin.getPgInf($curPg);
            plugin.setIndTxt();
            load2nav();
            plugin.adjustNavState();

            doCleanup();

        });

未运行的线路是$newPg.removeAttr('style');

我将该行放在块中的哪个位置或如何选择$newPg似乎并不重要。

哦，是的，我使用的是 Chrome 19.0.1084.52。

【问题讨论】：

只有那一行没有执行吗？还是执行与该行停止？你确定$newPg 被定义并且是一个jQuery 对象吗？

标签： javascript jquery google-chrome callback cross-browser

【解决方案1】：

删除style 属性是不可靠的。它可能不会触发页面的重绘（而控制台日志或断点会强制它）。相反，请尝试手动调用：

$newPg.style.XYZ = "";

对于您定义的每个样式属性，如果您可以列出它们。如果没有，试试这个：

for( var x in $newPg.style) $newPg.style[x] = "";

这些将触发正确的重绘，并有望解决问题。

【讨论】：

是的。将其更改为 $newPg.attr('style', ''); 就成功了。感谢您对断点和 console.log 的解释 - 这会让我不会走神。