jquery分步表单

在我的演示中，我有一个逐步的表单，我需要使用活动类来修复面包屑导航

一切正常，但菜单上的“活动”似乎不起作用。 你能帮我看一下吗

（函数（）{
var-prevLink=''；
var nextLink=''；
var navHTML=''+prevLink+nextLink+''；
var FormData=[]；
$（函数（）{
//初始化
$（'#stepbystep>fieldset'）.hide（）.append（navHTML）；
$（“#第一步.取消”）.remove（）；
$（“#最后一步.继续”）.remove（）；
//显示第一步
$（“#第一步”）.show（）；
$（'input.continue'）。单击（函数（）{
var whichStep=$（this.parent（）.parent（）.attr（'id'）；
$（'.breadcrumb a'）.addClass（'active'）；
如果（whichStep=='first step'）{}
else if（whichStep=='second step'）{
else if（whichStep==“第三步”）{
else if（whichStep==“第四步”）{
else if（whichStep=='last step'）{
$（this.parent（）.parent（）.hide（300）.next（）.show（300）；
$（'.breadcrumb a'）.removeClass（'active'）；
});
$（'input.cancel'）。单击（函数（）{
$（this.parent（）.parent（）.hide（300）.prev（）.show（300）；
});
})
}());

它不工作的原因是因为代码如下：

$('.breadcrumb a').addClass('active');
// other stuff
$('.breadcrumb a').removeClass('active');

因此，每次单击“继续”按钮时，您都会使面包屑

中的每个链接处于活动状态，然后几乎立即（即，在同一函数中）使它们都处于非活动状态。如果您单步执行调试器，您可以看到调试器的样式更改，然后再更改回来

如果要使特定元素
处于活动状态
，则必须以某种方式标识该特定元素。基本上，您希望用以下命令启动函数：

$('.breadcrumb a').removeClass('active');

这样，您就可以“取消激活”任何一个处于活动状态的
（因为您不在乎哪个处于活动状态，所以只需点击所有这些）。然后，您需要确定要在其上添加
活动
类的特定元素。这可能有点棘手

也许给每个人一个
id
，这样你就可以直接引用他们了？或者，由于您似乎已经有了“第一步”和“第二步”等概念，您可以使用以下内容引用它们：

$('.breadcrumb a').eq(2).addClass('active');

这将引用匹配元素中的第三个元素（索引
2
），因此它将适用于“第三步”。
看起来您针对的是所有面包屑链接：

   $('.breadcrumb a').addClass('active');

您可能希望为链接提供一个id，然后在if语句中添加该类

   var whichStep = $(this).parent().parent().attr('id');
   // remove active from all links then add back the to the step you are on    
   $('.breadcrumb a').removeClass('active');

   if (whichStep == 'first-step') { 
     $('.breadcrumb #stepOne').addClass('active');
   }

在代码中添加以下函数


然后按如下方式相应地调用它们

   //Inside Continue click
   updateBreadCrumb ( whichStep, false);

   //Inside Cancel click
   updateBreadCrumb ( whichStep, true);

我相信你的问题是回发。尝试将变量保存在一个隐藏的输入中，这样您就可以在加载时刷新classomg I is some sleep以致于错过了=X+1@DD77：我想象您的函数将从删除类开始（当前它从添加类开始），然后将类添加到
if/else if/else if/etc.
构造中的适当元素中，在该构造中确定流程的当前步骤。
    function updateBreadCrumb (whichStep, isCancel) {
       var bc = 1;
       if (isCancel) bc = -1;
       $('.breadcrumb a').removeClass('active');

       if (whichStep == 'second-step') {
           bc += 1;
        } else if (whichStep == 'third-step') {
           bc += 2;
        } else if (whichStep == 'fourth-step') {
           bc += 3;
        } else if (whichStep == 'last-step') {
           bc += 4;
        }
        $('.breadcrumb a:eq('+bc+')').addClass('active');
    }

   //Inside Continue click
   updateBreadCrumb ( whichStep, false);

   //Inside Cancel click
   updateBreadCrumb ( whichStep, true);