Vin*_*ein 4 javascript jquery jquery-steps
我正在使用jQuery Steps进行我的站点注册向导,工作非常棒,除了在第一步我得到上一个按钮,这没有任何意义,因为没有以前的内容.
我查看onInit()了API 中的函数,但没有设置enablePreviousButton,仅enableFinishButton和enableCancelButton.
有没有办法可以在第一步删除上一步按钮?
请求的代码:
$("#register-form").steps({
headerTag: "h3",
bodyTag: "fieldset",
autoFocus: true,
onInit: function (event, current) {
alert(current);
},
labels: {
finish: 'Sign Up <i class="fa fa-chevron-right"></i>',
next: 'Next <i class="fa fa-chevron-right"></i>',
previous: '<i class="fa fa-chevron-left"></i> Previous'
}
});
Run Code Online (Sandbox Code Playgroud)
HTML:
<h3><?= $lang_wizard_account; ?></h3>
<fieldset>
<legend><?= $lang_text_your_details; ?></legend>
<div class="form-group">
<label class="control-label col-sm-3" for="username"><b class="required">*</b> <?= $lang_entry_username; ?></label>
<div class="col-sm-8">
<input type="text" name="username" value="<?= $username; ?>" class="form-control" placeholder="<?= $lang_entry_username; ?>" autofocus id="username" required>
<?php if ($error_username) { ?>
<span class="help-block error"><?= $error_username; ?></span>
<?php } ?>
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-3" for="firstname"><b class="required">*</b> <?= $lang_entry_firstname; ?></label>
<div class="col-sm-8">
<input type="text" name="firstname" value="<?= $firstname; ?>" class="form-control" placeholder="<?= $lang_entry_firstname; ?>" id="firstname" required>
<?php if ($error_firstname) { ?>
<span class="help-block error"><?= $error_firstname; ?></span>
<?php } ?>
</div>
</div>
....
</fieldset>
Run Code Online (Sandbox Code Playgroud)
这具有相同的效果,但是更少hack-y:
.wizard > .actions > ul > li.disabled {
display: none;
}
Run Code Online (Sandbox Code Playgroud)
好吧,非常丑陋的 hack 但它确实按预期工作:
$("#register-form").steps({
headerTag: "h3",
bodyTag: "fieldset",
autoFocus: true,
onInit: function (event, current) {
$('.actions > ul > li:first-child').attr('style', 'display:none');
},
onStepChanged: function (event, current, next) {
if (current > 0) {
$('.actions > ul > li:first-child').attr('style', '');
} else {
$('.actions > ul > li:first-child').attr('style', 'display:none');
}
},
labels: {
finish: 'Sign Up <i class="fa fa-chevron-right"></i>',
next: 'Next <i class="fa fa-chevron-right"></i>',
previous: '<i class="fa fa-chevron-left"></i> Previous'
}
});
Run Code Online (Sandbox Code Playgroud)
感谢白盒!