javascript - 如何为同一 div 中存在的两种形式切换显示和隐藏？

Question

我在一个 div 中有两个表单，当页面加载时 form1 是可见的，如果我单击下一个按钮，form1 将被隐藏并显示 form2，这按预期工作。

现在我想实现上述场景的反转，即单击后退按钮时，应隐藏 form2 并显示 form 1。

这是我到目前为止的 javascript 代码..

function switchVisible() {

  document.getElementById("disappear").innerHTML = "";

  if (document.getElementById('newpost')) {

    if (document.getElementById('newpost').style.display == 'none') {
      document.getElementById('newpost').style.display = 'block';
      document.getElementById('newpost2').style.display = 'none';
    } else {
      document.getElementById('newpost').style.display = 'none';
      document.getElementById('newpost2').style.display = 'block';
    }

  }

}

所以基本上我正在寻找一种方法来使用 javascript 并设置它们的显示属性来实现同一 div 中存在的两种形式的切换功能。

Answer 1

使用一个变量stepCount然后根据count的值显示合适的form。

比如用 0 初始化 stepCount，然后在单击 next 时将其递增 1 并检查条件，如果 stepCount 为 1，则显示第二种形式

类似地，如果按下后退按钮，则将 stepCount 减 1 并检查条件，如果 stepCount 为 0，则显示第一个表单

在点击适当的按钮点击事件时完成所有这些