Question

我正在使用JQuery Steps，这非常棒。但有些事情证明是棘手的。

假设我在第2步。根据我在表单中选择的内容，我可能希望在＆＃34; next＆＃34;之后直接跳到第4步。单击，然后完全禁用步骤3锚点。步骤3锚点仍应显示在步骤列表中，它应该显示为灰色并禁用。

我似乎无法让这个工作。来自JQuery Steps大师的任何建议？

我在onStepChanged中尝试了以下几种变体：

                if ($('#option').val() == 'foo') {
                     $('#wizard-t-3').attr('disabled', true);
                     $('#wizard-t-3').addClass('disabled');
                } else {
                     $('#wizard-t-3').attr('disabled', false);
                     $('#wizard-t-3').removeClass('disabled');
                }
                if (currentIndex == 2) {
                    $(this).steps('next');
                }

并应用我认为合适的CSS：

.wizard＆gt; .steps a .disabled，.wizard＆gt; .steps a：hover .disabled，.wizard＆gt; .steps a：active .disabled，.wizard＆gt; .steps a：visited .disabled { 颜色：＃777; cursor：默认 }

但它似乎没有做到这一点。并且它不仅仅是似乎不起作用的CSS，似乎仍然启用了该步骤。 Chrome调试器中的所有内容都是正确的，但它无法正常工作。我显然很困惑。

Answer 1

我意识到这是一个古老的问题，但这就是我采取的措施来解决这个问题。

将以下内容添加到jquery.steps.js：

$.fn.steps.incomplete = function (i) {
    var wizard = this,
    options = getOptions(this),
    state = getState(this);

    if (i < state.stepCount) {
        var stepAnchor = getStepAnchor(wizard, i);
        stepAnchor.parent().addClass("disabled");
        stepAnchor.parent().removeClass("done")._enableAria(false);
        refreshSteps(wizard, options, state, i);
    }
};

...然后使用它来调用它：

    $("#yourWizard").steps('incomplete', stepNumber);

希望这有帮助。

JQuery步骤：如何禁用一个步骤？

1 个答案: