Question

我遇到IE中的问题（在chrome，firefox和safari中工作正常），我在文档范围声明的var未定义且无法写入。它看起来像这样：

myFile.js

var background;
var opacity;
var zIndex;

function backupValues() {
   var overlay = $(".ui-widget-overlay");
   background = overlay.css("background");
   opacity = overlay.css("opacity");
   zIndex = overlay.css("z-index");
}

function restoreValue() {
   $(".ui-widget-overlay").css("background", background).css("opacity", opacity).css("z-index", zIndex);
}

我在IE中调试了这个，发现在每个赋值之前和之后，所有的值都是'undefined'。这有什么不对？为什么这在其他浏览器中有效？ IE是否对文档范围变量有一些特殊的警告？

Answer 1

如果在赋值后未定义，则可能意味着该元素的css样式中没有赋值。

在分配之前它们是未定义的，无论如何它应该在所有浏览器中。值undefined是任何（声明的）变量的默认值。

另请注意，“文档范围”变量实际上附加到全局对象（在您的情况下很可能是window对象），以这种方式污染全局命名空间是一种非常糟糕的做法。克服它的一种方法可能是围绕整个事件进行匿名函数闭包，例如：

(function() { var background; var opacity; var zIndex; function backupValues() { var overlay = $(".ui-widget-overlay"); background = overlay.css("background"); opacity = overlay.css("opacity"); zIndex = overlay.css("z-index"); } function restoreValue() { $(".ui-widget-overlay").css("background", background).css("opacity", opacity).css("z-index", zIndex); } window.my.fancy.namespace = { backupValues: backupValues, restoreValues: restoreValues }; }());

这会使变量成为范围的本地变量。 “未定义”行为保持不变，因为这是行为的方式。

编辑：虽然与您的问题没有直接关系，但我更新了代码，以展示如何在保持变量本地的同时公开可从外部访问的函数。

Answer 2

原来问题出在.css()函数中。 jQuery函数.css()应该封装浏览器之间的差异（即IE使用不同的样式属性进行不透明度比其他浏览器）。但是，它似乎在IE中的不透明度上被打破了。为了使这项工作适用于所有浏览器，我必须管理很多属性和案例，这是一个坏主意。

解决方案是完全避免这个问题并使用整体更优雅的解决方案。我没有备份变量中的值，而是在我的css文件中为我要覆盖的值定义了一个新样式。我只是致电backupValues()和restoreValues()，而不是致电.addClass("myClass")和.removeClass("myClass")。这给了我完全相同的效果，并且不必补偿有时相当复杂的浏览器的差异。

javascript：var仅在IE中未定义

2 个答案: