IOS上的Safari生成“ReferenceError：找不到变量：”

Question

以下代码适用于所有浏览器，包括Mac上的Safari，但iPhone上的Safari除外。

我有一个可能正在运行的计时器对象，其定义如下：

//delay background change until animation is finished
lastTimer = setTimeout(function () {
  $('#' + targetDiv).removeClass('open');
}, 150);

稍后，我需要检查计时器是否正在运行，如果是，则取消它。这是我正在使用的代码：

if (lastTimer != null) { clearTimeout(lastTimer); }

这是IOS Safari生成JavaScript错误的地方：

“ReferenceError：找不到变量：lastTimer”。

关于为什么检查null的任何想法都没有阻止错误，就像其他浏览器似乎一样？

以下是回答以下答复的两个相关功能的完整代码:(使用解决方案编辑）

// Class for handling the animations for the drop down menus
var dropDownMenu = {
lastTimer: null,
openMenu: function (targetDiv) {
    if (targetDiv != null) {
        var targetHeight = $('#' + targetDiv).height();
        $('#' + targetDiv).stop(true); //stop an previous animations and clear queue
        if (this.lastTimer != null) { clearTimeout(this.lastTimer); } //stop possible pending timer to prevent background change
        console.log("testing b");
        $('#mainNavigation #dropDownMenu ul').removeClass('open'); // make sure all closed menus show corrent bgd
        $('#' + targetDiv).animate({
            bottom: -(targetHeight + 30)
        }, 200, 'swing');
        $('#' + targetDiv).addClass('open');
    }

},
closeMenu: function (targetDiv) {
    if (targetDiv != null) {
        $('#' + targetDiv).stop(true); //stop an previous animations and clear queue
        $('#' + targetDiv).animate({
            bottom: 0
        }, 200, 'swing');
        //delay background change until animation is finished
        this.lastTimer = setTimeout(function () {
            $('#' + targetDiv).removeClass('open');
        }, 150);
    }
}
}

当ios中发生错误时，执行将停止，并且我的测试console.log不会立即执行。

Answer 1

您的问题似乎是在IOS上，首先调用openMenu。

这意味着您正在尝试获取未声明变量的值，从而产生ReferenceError。

奇怪的是，您可以分配一个未声明的变量，该变量隐式地使其成为全局变量。因此，如果首先调用closeMenu，则首先进行赋值，使变量隐式声明。

正确的解决方案是在使用变量之前始终声明变量。

var lastTimer;

但事实证明，您更喜欢在当前对象上使用属性而不是变量。因此，解决方案是访问方法中的属性...

this.lastTimer

这将永远不会抛出ReferenceError，即使该财产未被宣布。

Answer 2

我想在此解释一下。使用简单检查检查未定义时，Mobile Safari不太宽容，

if variable

当你遇到这样的情况然后使用，

if typeof variable === "undefined"

将变量附加到“this”是这里的一个解决方案，但它只是利用了defineVariable.undefinedProperty返回undefined的事实，而直接引用未定义的变量将导致某些运行时环境中的引用错误。

如果没有必要，我建议不要养成附加“这个”的习惯。

Answer 3

还有一个我认为需要说明的潜在问题。 iOS *上的Safari可以非常积极地进行缓存，而不是重新加载代码的干净副本。

例如如果您在没有定义变量的情况下执行了一个版本的代码，那么修复代码但重新加载时错误会继续显示（即使您关闭浏览器/重新启动手机）

要解决此问题，请点按并按住（也称为长按）地址栏中的重新加载图标，然后会弹出一个菜单，其中包含2个选项“请求桌面站点”和“重新载入内容无阻塞”。选择其中任何一个都会导致所有内容的Real重新加载...这解决了任何缓存的错误代码的问题。

*不仅仅是Safari。 iOS上的Chrome（基于Apple的WebKit版本）可能会出现同样的问题。

Answer 4

您的代码中有一个全局变量。不声明var使其全局化。

尝试改变：

if (lastTimer != null)

至

if (typeof lastTimer !=="undefined" && lastTimer)

如果你坚持它是全球性的。