使用javascript單擊按鈕時如何在兩個不同的功能之間切換？

Question

在單擊按鈕時，我正在調用此功能

toggleFunction(){
    //Do something here to toggle between function A and function B
}

A(){} //Call this first
B(){} //Call this after

如何以簡單的方式在javascript中實現？

在此先多謝！

Answer 1

您必須使用變量來管理切換：

var toggle = true;

toggleFunction(){
    toggle ? functionA() : functionB();
    toggle = !toggle;
}

functionA() {}
functionB() {}

Answer 2

正如@Faly所說，您需要一個變量來切換。

新方法是使用~~將boolean轉換為number 。

function A() {console.log('A');
function B() {console.log('B');
var funcs = [A,B]; 
var bool = false; 
function toggleFunction() { 
  funcs[~~bool](); 
  bool = !bool; 
}

Answer 3

設置一個lastInvokedIndex屬性，該屬性將保存最后調用的方法名稱

btn.addEventListener( "click", function(e){
  var methodsToInvoke = [ A, B ];
  var el = e.currentTarget;
  //el.lastInvokedIndex = el.lastInvokedIndex || 0;
  el.lastInvokedIndex = el.lastInvokedIndex >= methodsToInvoke.length ? 0 : (el.lastInvokedIndex || 0);
  methodsToInvoke[el.lastInvokedIndex++]();
});

演示

 var A = () => { console.log("A") }; var B = () => { console.log("B") }; var btn = document.querySelector( "button" ); btn.addEventListener( "click", function(e){ var methodsToInvoke = [ A, B ]; var el = e.currentTarget; //el.lastInvokedIndex = el.lastInvokedIndex || 0; el.lastInvokedIndex = el.lastInvokedIndex >= methodsToInvoke.length ? 0 : (el.lastInvokedIndex || 0); methodsToInvoke[el.lastInvokedIndex++](); }); 

 <button>Click</button>