在第一步jQuery步骤中删除上一个按钮

时间:2015-03-22 03:17:47

标签: javascript jquery jquery-steps

我正在为我的网站注册向导使用jQuery Steps,工作非常棒,但在第一步我得到了上一个按钮,这是没有意义的,因为没有以前的内容。

我查看了API中的onInit()函数,但没有设置enablePreviousButton,只有enableFinishButtonenableCancelButton

有没有办法可以在第一步中删除上一个按钮?

请求的代码:

$("#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:

<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>

4 个答案:

答案 0 :(得分:8)

这具有相同的效果,但不那么黑客:

pointcut daoCall() : call(* * DAO.*(..)) &&
  cflow(within(ValidateService.validate()));

答案 1 :(得分:3)

好的,非常丑陋的黑客,但它确实按预期工作:

$("#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'
    }
});

感谢whitebox!

答案 2 :(得分:0)

这是使用jQuery的很好的解决方案:

$("a[href$='next']").hide();
$("a[href$='previous']").hide();

此解决方案可让您调用.click()函数来进行下一个或上一个操作,如下所示:

$("a[href$='next']").click();

$("a[href$='previous']").click();

答案 3 :(得分:0)

以前的解决方案对我而言并不奏效,但确实如此:

.wizard > .actions > ul > li.disabled > a {
  background: white;
}