jquery css(空白)IE7/8 错误？

Question

我们刚刚花了一些时间来追查 IE7/8 中一些非常奇怪的 jQuery/css 行为。

我们做了一些动画和高度测量。在制作动画时，我们不希望文本换行。所以我们这样做了:

$(selector).css("white-space", "nowrap");
... animate ...
$(selector).css("white-space", "inherit");

这在 FF、Chrome、Safari、iPad，甚至 IE9 上运行良好，但在 IE7 或 8 上我们会遇到 Javascript 错误:

"Could not get the whiteSpace property. Invalid argument"

深入了解 jQuery。经过一番摸索之后，我们最终这样做了:

首先，在.css中定义一个类:

/* Kludge to avoid IE7/8-jQuery css('white-space') problem? */
.nowrap { white-space: nowrap; }

然后修改上面的动画代码:

$(selector).addClass("nowrap");
... animate ...
$(selector).removeClass("nowrap");

现在每个人都很开心，但这种困惑确实让我很烦恼。 jQuery 会为 IE 做某种 CSS 翻译吗？我们使用的是 jQuery 1.4.2。

Answer 1

在这里测试:http://jsfiddle.net/nL48C//http://fiddle.jshell.net/nL48C/show/light/
错误存在于 IE7 和 IE8 的 [IE7] 兼容模式中。 它在 IE8 标准模式下运行良好。

注释掉 inherit 行:http://jsfiddle.net/nL48C/1//http://fiddle.jshell.net/nL48C/1/show/light/
错误消失了。

我几乎完全了解 IE7 doesn't support inherit ，所以这就是问题的根源。

但是，如果您尝试使用 jQuery 1.4.4 inherit，则没有错误:
http://jsfiddle.net/nL48C/2//http://fiddle.jshell.net/nL48C/2/show/light/

看起来 jQuery 1.4.2 缺少一些 1.4.4 必须解决这个问题的魔力。

jQuery 1.4.2:

if ( set ) {
    style[ name ] = value;
}

jQuery 1.4.4:

// Wrapped to prevent IE from throwing errors when 'invalid' values are provided
// Fixes bug #5509
try {
    style[ name ] = value;
} catch(e) {}

• http://bugs.jquery.com/ticket/5509
• https://github.com/jquery/jquery/commit/2ca36598954759c5b5dce569a39c52b981ed4ab2

解决方案:

• 不要设置为inherit，设置为normal，即initial value .