Question

我在我的应用程序中实现了向导引导程序。

我想检索要测试的Current选项卡的索引显示或隐藏按钮＆＃39;下一步＆＃39; ＆＃39;上一页＆＃39;

$('#rootwizard').bootstrapWizard({
    'nextSelector': '.button-next',
    'previousSelector': '.button-previous',
    onTabClick: function (tab, navigation, index) {
        var total = navigation.find('li').length;

        // here i want get the currecnt index of tab clicked 
        var current = index +1 ;
        alert();

        // set wizard title
        $('.step-title', $('#rootwizard')).text('Step ' + (index) + ' of ' + total);

        // set done steps
        jQuery('li', $('#rootwizard')).removeClass("done");
        var li_list = navigation.find('li');

        for (var i = 0; i < index; i++) {
             jQuery(li_list[i]).addClass("done");
        }
        if (current == 1) {
            $('#rootwizard').find('.button-previous').hide();
        } else {
            $('#rootwizard').find('.button-previous').show();
        }
        if (current >= 13) {
            $('#rootwizard').find('.button-next').hide();
            $('#rootwizard').find('.button-submit').show();
        } else {
            $('#rootwizard').find('.button-next').show();
            $('#rootwizard').find('.button-submit').hide();
        }
        App.scrollTo($('.page-title'));

HTML：

<ul class="nav nav-tabs">                               
    <li class=" active" id="dbt"><a href="#portlet_tab1" data-toggle="tab">aaa</a></li>
    <li class=""><a href="#portlet_tab2" data-toggle="tab">   bbb   </a></li>
    <li class=""><a href="#portlet_tab3" data-toggle="tab">   ccc   </a></li>
    <li class=""><a href="#portlet_tab4" data-toggle="tab">    dddd    </a></li>
</ul>

Answer 1

要显示来自$（document）.ready（）的索引或代码中的其他函数：

alert( $('#rootwizard').bootstrapWizard('currentIndex') );

在您的情况下，在创建向导时，在声明“onTabClick”功能时忘记了单引号。无论如何，我建议你改为使用'onTabShow'事件：

$('#rootwizard').bootstrapWizard({
'nextSelector': '.button-next',
'previousSelector': '.button-previous',
'onTabShow': function (tab, navigation, index) {
    var total = navigation.find('li').length;

    // here i want get the currecnt index of tab clicked 
    var current = index + 1 ;
    alert(current);

    // set wizard title --> CHANGED 'index' by 'current'
    $('.step-title', $('#rootwizard')).text('Step ' + (current) + ' of ' + total);

    // set done steps
    jQuery('li', $('#rootwizard')).removeClass("done");
    var li_list = navigation.find('li');

    for (var i = 0; i < index; i++) {
         jQuery(li_list[i]).addClass("done");
    }
    if (current == 1) {
        $('#rootwizard').find('.button-previous').hide();
    } else {
        $('#rootwizard').find('.button-previous').show();
    }
    if (current >= 13) {
        $('#rootwizard').find('.button-next').hide();
        $('#rootwizard').find('.button-submit').show();
    } else {
        $('#rootwizard').find('.button-next').show();
        $('#rootwizard').find('.button-submit').hide();
    }
    App.scrollTo($('.page-title'));

我知道，我有点迟了，但我希望它可以帮助别人。

向导引导程序返回当前选项卡

1 个答案: