Question

我无法在其上找到任何文档或信息，那么如何在bootstrap选项卡中禁用下一个按钮，而不是在安装旁边更改？

 .bootstrapWizard({
    tabClass: 'nav nav-tabs',
    onTabClick: function(tab, navigation, index) {
        return validateTab(index);
    },
    onNext: function(tab, navigation, index) {
        var numTabs    = $('#reservationForm').find('.tab-pane').length,
            isValidTab = validateTab(index - 1);
        if (!isValidTab) {
            return false;
        }

        if (index === numTabs  -1) {

        }

        return true;
    },
    onPrevious: function(tab, navigation, index) {
        return validateTab(index + 1);
    },
    onTabShow: function(tab, navigation, index) {
        // Update the label of Next button when we are at the last tab
        var numTabs = $('#reservationForm').find('.tab-pane').length;
        $('#reservationForm')
            .find('.next')
            .removeClass('disabled')    // Enable the Next button
            .find('a')
            .html(index === numTabs - 1 ? 'Install' : 'Next');

    }
});

Answer 1

我和你的5个标签一样。这是我在第一个/最后一个标签中禁用previous按钮和next按钮的方法。

    onTabShow: function(tab, navigation, index) {

        switch (index) {
            case 0:
                // remove 'previous'

                $('ul.pager.wizard li.previous').addClass('hidden');
                break;
            case 1:
            case 2:
            case 3:
                $('ul.pager.wizard li.previous, ul.pager.wizard li.next').removeClass('hidden');
                break;
            case 4:
                // remove 'next'

                $('ul.pager.wizard li.next').addClass('hidden');
                break;
        }

        var $total = navigation.find('li').length;
        var $current = index + 1;
        var $percent = ($current / $total) * 100;
        $('#pills .progress-bar').css({
            width: $percent + '%'
        });
    }

如何禁用最后一个选项卡上的bootstrap向导下一个按钮？

1 个答案: