两个按钮可在两个功能和一个功能之间切换

Question

有 2 个按钮和两个功能。

Button1 应该在函数 A 和函数 B 之间切换。 Button2 应该始终只触发函数 B。

$("#hamburger").click( toggleAB );

$("#close").click(function(){
   functionB();
});

functionA(){ //expand menu }
functionB(){ //collapse menu }

function toggleAB(){
    var el = this;
    return [
      function() { functionA(); },
      function() { functionB(); }
    ][el.tog^=1]();
}

目前$("#hamburger") 在这两个功能之间完美切换。但是如果我点击$("#close")按钮，那么我必须点击$("#hamburger")按钮两次才能继续在两个功能之间切换。

我的问题是即使$("#close") 按钮被点击，我如何让$("#hamburger") 在函数A 和函数B 之间切换？

Answer 1

实现这一点的最简单方法是在按钮上存储一个标志，这样您就可以知道最后调用了哪个函数，这样您就知道接下来要调用哪个函数。试试这个：

$("#hamburger").click(function() {
  var clicks = $(this).data('clicks') || 0;
  clicks % 2 == 0 ? functionA() : functionB();
  $(this).data('clicks', ++clicks);
});

$("#close").click(function() {
  functionB();
});

function functionA() {
  console.log('A');
}
function functionB() {
  console.log('B');
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id="hamburger">Hamburger</button>
<button id="close">Close</button>