javascript - 如何在功能之间切换？

HTML

<button type="button" class="btn" name="showAllBtn" onClick="showAllSteps()">Show all</button>

JS

function showAllSteps()
{
//code
}
function nextStep()

{
//code
}

如果我单击“显示全部”按钮，则应在这两个功能之间切换。有人可以帮助我吗？

最佳答案

您可以使用dataset来存储点击状态，

document.querySelector("button[name='showAllBtn']").addEventListener("click",function(){
  var state = this.dataset.clicked;
  state = state || true;
  ((state) ? showAllSteps : nextStep)();
  this.dataset.clicked = !state;
},false);

编辑：True / false似乎导致上述代码出现问题。因此，我在上面做了一些调整，在下面进行了说明。

document.querySelector("button[name='showAllBtn']").addEventListener("click",function(){
  var state = this.dataset.clicked;
  state = typeof state == "undefined" ? "Y" : state;
  ((state == "Y") ? showAllSteps : nextStep)();
  this.dataset.clicked = (state == "Y") ? "N" : "Y";
},false);

DEMO

关于javascript - 如何在功能之间切换？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/37229029/