Question

我的jQuery步骤有点问题。我想在最后一步添加自定义按钮。我有三个步骤。我未能得到当前的指数。

$(document).ready(function () {
  $wizard = $("#wizard");
  $wizard.steps({
    onStepChanged: function (event, currentIndex, priorIndex) {
      var currentStep = $("#wizard").steps("getStep", currentIndex);
      if (currentStep == 2) {
        var $input = $('<input type="submit" value="test" />');
        $input.appendTo($('ul[aria-label=Pagination]'));
      }
    }
  });
});

Answer 1

在onStepChanged中，它会为您提供当前（步骤）索引 - 以及您需要的前一步骤。

您只需使用if(currentIndex === 2){...}确定您在第3步（索引意味着它从零开始）。

下面演示了这适用于简单的3步向导。请原谅缺乏造型！

＆＃13;

$('#wizard').steps({
    headerTag: "h3",
    bodyTag: "section",
    transitionEffect: "slideLeft",
    onStepChanged: function (event, currentIndex, priorIndex) {
        if(currentIndex == 2){
          var $input = $('<input type="submit" value="test" />');
          $input.appendTo($('ul[aria-label=Pagination]'));
        }
        else {
           $('ul[aria-label=Pagination] input[value="test"]').remove();
        }
    }
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-steps/1.1.0/jquery.steps.js"></script>
<div id="wizard">
    <h3>Page1</h3>
    <section>
        <p>Section1</p>
    </section>
    <h3>Page2</h3>
    <section>
        <p>Section2</p>
    </section>
    <h3>PAge3</h3>
    <section>
        <p>Section3</p>
    </section>
</div>

＆＃13;

当我到达第3步时，Jquery Steps添加自定义按钮

1 个答案: