jQuery Smart Wizard中leaveStep事件异常 无法正常控制提交按钮启用状态

问题根因 #

1. 事件参数理解错误：leaveStep 回调中的 stepNumber 指的是即将离开的步骤序号，而非将要进入的目标步骤序号。你当前的逻辑判断stepNumber == 4时激活按钮，等价于「离开第5步（序号4）」时才激活提交按钮，逻辑完全颠倒，这是所有故障的核心原因：
   • 从第4步（序号3）切往第5步（序号4）时，触发leaveStep的stepNumber为3，判断不成立，按钮保持禁用
   • 从第5步（序号4）切回第4步（序号3）时，触发leaveStep的stepNumber为4，按钮反而被激活
   • 刷新后从第1步走到第4步全程没有触发过stepNumber == 4的leaveStep事件，按钮始终处于初始禁用状态
2. 事件选择不合理：leaveStep是步骤切换前触发的事件，如果切换过程被校验逻辑中断（比如当前步骤表单校验不通过阻止跳转），提前修改按钮状态会出现状态和实际步骤不匹配的问题。

修复方案 #

推荐改用showStep事件，该事件在步骤切换完成后触发，回调拿到的stepNumber就是当前已经进入的步骤序号，逻辑更稳定：

$("#smartwizard").on("showStep", function(e, anchorObject, stepNumber, stepDirection) {
    // 仅当前处于最后一步（序号4）时激活提交按钮，其余情况禁用
    $('#newUserSubmit').prop('disabled', stepNumber !== 4);
});

如果有特殊场景必须使用leaveStep，则需要先计算目标步骤序号再做判断，同时要处理切换被阻止的异常场景，稳定性远低于上述方案：

$("#smartwizard").on("leaveStep", function(e, anchorObject, stepNumber, stepDirection) {
    const targetStep = stepDirection === 'forward' ? stepNumber + 1 : stepNumber - 1;
    $('#newUserSubmit').prop('disabled', targetStep !== 4);
});

可选优化 #

为了避免初始化、外部跳转步骤等特殊场景下按钮状态异常，可以在初始化完成后额外加一次状态校验：

// 初始化完成后根据当前默认选中的步骤设置按钮状态
const currentStep = $('#smartwizard').smartWizard('getStepIndex');
$('#newUserSubmit').prop('disabled', currentStep !== 4);

内容的提问来源于stack exchange，提问作者Armitage2k