Javascript 如何保存已填写表单的一部分，并使用标题中的步骤号在JQM中导航

我有一个基本上是多阶段的表格，见下图

我想做的是在顶部绿色的步骤，这些步骤应该变成一个按钮点击，我可以跳到这一步

现在，我只能来回走动了。我不会跳台阶

这是一个

HTML

<div class="progress1">
                <ul class="cf checkout-tabs breadcrumb" style="list-style:none"><span class="done1 talign-center stage-login">1</span>
            <li class="active1 talign-center stage-login">2</li>
            <li class="disabled talign-center stage-delivery">3</li>
            <li class="disabled talign-center stage-delivery">4</li>
            <li class="disabled talign-center  stage-payment">5</li>

        </ul>

    </div>

1
2
3
4
5

感谢和问候

工作示例：

新增代码：

$(".ui-content").on("click", ".checkout-tabs li",function (e) {
    var selectedTab = $(this);
    $(".checkout-tabs li").each(function(index) {
        if(index <= selectedTab.index()) {
            $(this).addClass('active1');
            if(index < selectedTab.index()) {
                $(this).addClass('done1');            
            } else {
                $(this).removeClass('done1');                  
            }
        } else if(index > selectedTab.index()) {
            $(this).removeClass('active1 done1');            
        }
    });         
    $(".step").each(function() {
        $(this).removeClass('active').addClass("ui-screen-hidden");
    }); 
    $(".step:eq(" + selectedTab.index() + ")").removeClass('ui-screen-hidden').addClass("active");
}); 

$（“.ui内容”）。在（“单击“，”.checkout选项卡li”）上，函数（e）{
var selectedTab=$（此值）；
$（“.checkout tabs li”）。每个（函数（索引）{
如果（index selectedTab.index（））{
$（this.removeClass（'active1 done1'）；
}
});         
$（“.step”）。每个（函数（）{
$（this.removeClass（'active'）.addClass（“ui屏幕隐藏”）；
}); 
$（“.step:eq（“+selectedTab.index（）+”））.removeClass（'ui-screen-hidden'）.addClass（“active”）；
}); 

---

您应该添加代码，以防止跳转到尚未启用的选项卡。我希望这就是你所需要的。

嘿，兄弟，我看到你用这种多步骤的造型超越了自己，它非常漂亮。恭喜。关于您当前的问题，请给我们您的JSIDdle:）谢谢男士：）我现在添加了一个演示JSIDdle。它不包含表单详细信息，但它的标题与我使用的@Gajotress相同。由于某些原因，JSIDdle当前不起作用，当它返回联机时，我将为您解决此问题。JSIDdle关闭，请将代码复制到jsbin.come或codepen。io@Omar我使用了与您设计的滑块相同的滑块，希望可以：）