Bootstrap中的分阶段捐赠表格

Question

我一直在尝试在Bootstrap中创建一个分阶段的捐赠表单，您可以使用向前和向后按钮移动到同一表单的另一部分。它会在顶部有一个很好的指标，表示你所处的完成阶段。分期捐赠表格平均增加了4.8％的捐赠率，所以我真的很想拥有它。

我找到了一个tutorial online这样做非常好，但它有一些问题我希望有人可以帮我解决（代码链接）：

1）如果将列与另一列并排放置，则在按下下一个按钮时会出现故障，将内容向下移动。

2）我无法应用CSS min-height属性，并在按下下一个按钮后保持为true。这将使形式的每个部分保持相同的高度，并将底部的按钮保持在同一位置。

3）它不包含后退按钮的javascript。

4）我真的不需要表单验证，因此它无用。

感谢你们给我的任何帮助，我知道在一个问题上提出要求是非常有帮助的，但JS不是我的专长，而且它是慈善机构的无偿工作。

Answer 1

对于后退按钮，您需要创建一个新按钮以转到上一步并将其添加到第二步和第三步的HTML中。然后，您基本上可以复制nextBtn功能并将其重复用于上一个按钮（但您可以删除输入验证，因为前一个按钮不需要它。）

这里是按钮代码：

<button class="btn btn-primary prevBtn btn-lg pull-left" type="button">Back</button>

和Javascript：

allPrevBtn.click(function(){
      var curStep = $(this).closest(".setup-content"),
          curStepBtn = curStep.attr("id"),
          prevStepWizard = $('div.setup-panel div a[href="#' + curStepBtn + '"]').parent().prev().children("a");

          prevStepWizard.trigger('click');
  });

Working example