单击按钮更改步骤- jquery步骤

Question

所以我在JQuery步骤中遇到了这个问题，在我的第一步中，我禁用了next按钮，以强制用户单击两个按钮:选项1或选项2。当用户单击这两个按钮中的任何一个按钮时，它将转到下一步(步骤2)。但我不知道当用户单击其中任何一个按钮时，如何触发事件来更改步骤。你知道该用什么函数吗？

Answer 1

你的意思是像这样的东西，还是点击按钮时的实际代码？

    $(document).on('click', '.class', function()
    {
        show following step/hide current step?
        clear current html - append next steps html dynamically?
    });

很难猜出你想要什么，试着更具体地回答你的问题。

Answer 2

所以，我今天实现了这个(如果你指的是jQuery步骤)：你能做的如下所示。(您可能不需要所有的细节，比如transitionalEffects -它就是我在实现中所拥有的)。

$("#steps").steps({
    headerTag: "h3",
    bodyTag: "section",
    enableAllSteps: true,
    transitionEffect: "slide",
    stepsOrientation: "vertical",

    onStepChanged: function(event, currentIndex, priorIndex)
    {
        alert('On step changed'); // you can see the step change was picked up
        var current = $("#steps").steps("getCurrentStep"); // get the current step            
        if(current.title == "My Step Two") // see if it matches the name of the step
            alert('Step two was selected');
    }

});

下面是这些步骤的HTML可能显示的样子：

         <div id="steps">
               <h3>My Step One</h3>
                  <section id="stepOne">
                    <!-- step one code -->
                  </section>
               <h3>My Step Two</h3>
                  <section id="stepTwo">
                      <!-- step two code -->
                  </section>
         </div>

它所做的是侦听一个名为onStepChanged的事件。然后，您可以调用名为getCurrentStep的方法，该方法返回整个step对象。然后，您可以询问步骤的title，并查看它是否与您的step div标记中的内容匹配。

希望这能满足你的需求。