Javascript 函数破坏/变量被遗忘

Question

很难在标题中描述问题，但基本上，我有一个函数，当单击按钮时，会检查元素上的一堆属性，以便显示/隐藏相关内容。

一切都很好，除了当我尝试添加一个额外的功能，在选择某个选项卡时隐藏面板。这是一个简单的 if 语句，我以为我不会遇到任何问题，但它有我见过的最奇怪的 react 。

有 3 个主要选项卡，其中一个值为“mirror”的选项卡关闭一组与我正在研究的 Controller 设计器的模式相关的选项卡。当单击“mirror”时，变量“dependingvar”被设置得很好，但是 - 它只会使用一次。 if 语句的代码如下:

if (dependingvar !== undefined) {
jQuery('.' + dependingvar).children('.cdesign-toggle').first().trigger('click');
jQuery('.' + dependingvar).hide();
lastdepend = dependingvar;
} else {
jQuery('.' + lastdepend).show();
}

只有触发点击的第一行才会运行。隐藏该组的第二个不会运行。如果我交换它们，该 block 将隐藏，但触发器不会运行。我检查了调试控制台，并且该变量在运行第一个控制台后实际上就被取消分配了。我不知道它发生了什么。

完整代码如下: http://pastebin.com/6QncXf6c

由于依赖性，我无法真正执行 JSFiddle，但这里是作为 Pastebin 的 HTML: http://pastebin.com/nePQbtjE

我真的不知道为什么会发生这种情况。还有一个重要的注意事项:如果 if 语句放置在除底部之外的任何位置，它会破坏代码的其余部分，取消设置变量，但仅当条件满足时(取决于 var !== undefined)。

我希望这是一个愚蠢的错误，但是有人能发现它吗？

Answer 1

我只是快速浏览了一下您的代码，但我想到了一些事情:

.trigger('click') 异步运行。事件处理程序会将其设置为 undefined(使用 null 或其他方式 - undefined 只能用于 undefined variable )。

在下一行中，您再次引用 dependingvar，但取决于 .cdesign-toggle click 事件是否具有运行到最后，dependingvar 可能有一个值或另一个值。不要直接引用 dependingvar，而是尝试克隆它，这样您就知道它的值不会在 if 语句内更改，大致如下:

if (dependingvar !== undefined) {
  var dependingvar_ = dependingvar; // or jQuery.clone(dependingvar) depending on the type of dependingvar
  jQuery('.' + dependingvar_).children('.cdesign-toggle').first().trigger('click');
  jQuery('.' + dependingvar_).hide();
  lastdepend = dependingvar_;
} else {
  jQuery('.' + lastdepend).show();
}