【发布时间】：2020-08-07 21:28:33
【问题描述】：
我想在最后一步显示“完成”按钮。我正在使用jquery smart wizard。
我没有看到任何内置方法来确定我是否处于最后一步？我错过了什么吗？
$(document).ready(function(){
// Toolbar extra buttons
var btnFinish = $('<button></button>').text('Finish')
.addClass('btn btn-info')
.on('click', function(){ alert('Finish Clicked'); });
var btnCancel = $('<button></button>').text('Cancel')
.addClass('btn btn-danger')
.on('click', function(){ $('#smartwizard').smartWizard("reset"); });
// Step show event
$("#smartwizard").on("showStep", function(e, anchorObject, stepNumber, stepDirection, stepPosition) {
$("#prev-btn").removeClass('disabled');
$("#next-btn").removeClass('disabled');
if(stepPosition === 'first') {
$("#prev-btn").addClass('disabled');
} else if(stepPosition === 'last') {
$("#next-btn").addClass('disabled');
} else {
$("#prev-btn").removeClass('disabled');
$("#next-btn").removeClass('disabled');
}
});
// Smart Wizard
$('#smartwizard').smartWizard({
selected: 0,
theme: 'arrows',
transition: {
animation: 'slide-horizontal', // Effect on navigation, none/fade/slide-horizontal/slide-vertical/slide-swing
},
toolbarSettings: {
toolbarPosition: 'both', // both bottom
toolbarExtraButtons: [btnFinish, btnCancel]
}
});
// External Button Events
$("#reset-btn").on("click", function() {
// Reset wizard
$('#smartwizard').smartWizard("reset");
return true;
});
$("#prev-btn").on("click", function() {
// Navigate previous
$('#smartwizard').smartWizard("prev");
return true;
});
$("#next-btn").on("click", function() {
// Navigate next
$('#smartwizard').smartWizard("next");
return true;
});
// Demo Button Events
$("#got_to_step").on("change", function() {
// Go to step
var step_index = $(this).val() - 1;
$('#smartwizard').smartWizard("goToStep", step_index);
return true;
});
$("#is_justified").on("click", function() {
// Change Justify
var options = {
justified: $(this).prop("checked")
};
$('#smartwizard').smartWizard("setOptions", options);
return true;
});
$("#dark_mode").on("click", function() {
// Change dark mode
var options = {
darkMode: $(this).prop("checked")
};
$('#smartwizard').smartWizard("setOptions", options);
return true;
});
$("#animation").on("change", function() {
// Change theme
var options = {
transition: {
animation: $(this).val()
},
};
$('#smartwizard').smartWizard("setOptions", options);
return true;
});
$("#theme_selector").on("change", function() {
// Change theme
var options = {
theme: $(this).val()
};
$('#smartwizard').smartWizard("setOptions", options);
return true;
});
});
【问题讨论】：
标签： jquery smart-wizard