javascript: var 仅在 IE 中未定义

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 中对此进行了调试，发现每次赋值之前和之后，所有值都是“未定义”。这里有什么问题吗？为什么这在其他浏览器中有效？ 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
   };

}());

这将使变量成为作用域的局部变量。不过，“未定义”的行为保持不变，因为这就是它应该的行为方式。

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