javascript - 在多个函数之间共享变量

Question

我正在创建一个简单的 Accordion 菜单，有两种导航方式。

1. 点击步骤标题
2. 点击步骤内的“下一步/上一步”按钮。

JSFiddle

我的js代码如下所示:

$(document).ready(function(){

// Click on TITLE
$(".step-title").click(function(){
  
  var this_title = $(this).parents(".step").children(".step-title");
  var this_content = $(this).parents(".step").children(".step-content");
  var that_title = $(".step-title");
  var that_content = $(".step-content");
    
  if (this_title.hasClass("active"))
  {
    this_title.removeClass("active");
    this_content.slideUp(200);

  } else {
    that_title.removeClass("active");
    this_title.addClass("active");
    that_content.slideUp(200);
    this_content.slideDown(200);
    }
  });
  
// Click on BUTTON
$(".save").click(function(){
  
  var this_title = $(this).parents(".step").children(".step-title");
  var this_content = $(this).parents(".step").children(".step-content");
  var that_title = $(".step-title");
  var that_content = $(".step-content");
    
  if (this_title.hasClass("active"))
  {
    that_title.addClass("active");
    this_title.removeClass("active");
    that_content.slideDown(200);
    this_content.slideUp(200);
  }
});

});

正如您所看到的，我在两个函数上重复使用相同的变量，这就是我问题的根源。

** 问题 ** 有没有办法让我在多个函数中共享这些变量？

当我将它们移出函数的本地范围时，它们不起作用。

感谢您的帮助。

Answer 1

有多种方法可以实现这一目标。

全局变量在 Js 中被认为是一件坏事(甚至是严格模式下的错误)，所以也许你应该保持原样，或者创建一个带有参数的函数(这只会触发函数的一部分)。

如果您确实想设置“全局”变量，则必须在变量名称之前省略 var :

foo = bar

但是正如我所说，它在严格模式下被认为是错误，并且可能导致不同的问题。一种“更干净”的方法是将变量分配给窗口对象。

window.foo = bar

像全局变量一样工作，缺点更少，可读性更强。