首页 > 解决方案 > Jquery SmartWizard 添加额外按钮

问题描述

如何在jquery 智能向导中添加额外的按钮

试过的代码:

我已经添加了工具栏部分代码..仍然无法正常工作。有人可以帮我吗?

JSFIDDLE 演示

$('#wizard').smartWizard({
            transitionEffect: 'slide',
            keyNavigation: false,
            onLeaveStep:leaveAStepCallback,
            onShowStep:showAStepCallBack,
            labelNext:'Save', 
            labelPrevious:'Back',
            labelFinish:'Finish',
      enableFinishButton: true,
            selected: 0,
        // step bar options
        toolbarSettings: {
          toolbarPosition: 'bottom', // none, top, bottom, both
          toolbarButtonPosition: 'left', // left, right
          showNextButton: false, // show/hide a Next button
          showPreviousButton: true, // show/hide a Previous button
          toolbarExtraButtons: ['NextBtn']
        }, 
        });

预期产出

我正在尝试在“下一步”按钮附近再添加一个按钮。

标签: javascriptjquerysmart-wizard

解决方案


如果有人有同样的问题,试试这个方法:

    $('#smartwizard').smartWizard({
        toolbarSettings: {
            toolbarExtraButtons: [
                $('<button></button>').text('Finish')
                            .addClass('btn btn-info')
                            .on('click', function(){ 
                                alert('Finish button click');                            
                            }),
                $('<button></button>').text('Cancel')
                            .addClass('btn btn-danger')
                            .on('click', function(){ 
                                alert('Cancel button click');                            
                            })
            ]
        },
    });

推荐阅读