javascript 在第一步 jQuery 步骤中删除上一个按钮
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/29190567/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Removing Previous Button on First Step jQuery Steps
提问by Vince Kronlein
I'm using jQuery Steps for my site signup wizard, works awesome with the exception that on the first step I'm getting the previous button, which really makes no sense since there is no previous content.
我在我的网站注册向导中使用了 jQuery Steps，除了在第一步我得到上一个按钮之外，它的工作很棒，这真的没有意义，因为没有以前的内容。
I looked at the onInit()function in the API but there is no setting for enablePreviousButton, only enableFinishButtonand enableCancelButton.
我查看onInit()了 API中的函数，但没有设置enablePreviousButton，只有enableFinishButton和enableCancelButton。
Is there a way I can remove the Previous button on the first step?
有没有办法在第一步中删除“上一步”按钮？
Requested code:
请求的代码：
$("#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'
}
});
HTML:
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>
采纳答案by Vince Kronlein
Ok, pretty ugly hack but it does work as expected:
好的，非常丑陋的 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'
}
});
Thanks to whitebox!
感谢白盒！
回答by Jonny
This has the same effect, but is way less hack-y:
这具有相同的效果，但不那么hack-y：
.wizard > .actions > ul > li.disabled {
display: none;
}
回答by khaled saleh
This is a good solution using jQuery:
这是使用 jQuery 的一个很好的解决方案：
$("a[href$='next']").hide();
$("a[href$='previous']").hide();
This solution allow you to call .click() function to go next or previous, like this:
此解决方案允许您调用 .click() 函数以转到下一个或上一个，如下所示：
$("a[href$='next']").click();
or
或者
$("a[href$='previous']").click();
回答by xke
The previous solutions didn't quite work for me, but this did:
以前的解决方案对我来说不太适用，但这确实适用：
.wizard > .actions > ul > li.disabled > a {
background: white;
}
