0

我的 Twitter Bootstrap 向导中有两个按钮：-

<div class="form-actions">
    <div class="row">
        <div class="col-sm-12">
            <ul class="pager wizard no-margin">
                <!--<li class="previous first disabled">
                <a href="javascript:void(0);" class="btn btn-lg btn-default"> First </a>
                </li>-->
                <li class="previous disabled">
                        <a id="prev" href="javascript:void(0);" class="btn btn-lg btn-default"> Previous </a>
                </li>
                <!--<li class="next last">
                <a href="javascript:void(0);" class="btn btn-lg btn-primary"> Last </a>
                </li>-->
                <li class="next" id="skip">
                        <a id="skip" href="javascript:void(0);" class="btn btn-lg txt-color-darken"> Skip </a>
                </li>
                <li class="next" id="next">
                        <a id="next" href="javascript:void(0);" class="btn btn-lg txt-color-darken"> Next </a>
                </li>
                 <li class="next finish" style="display:none;"><a href="javascript:;">Finish</a></li>
                 <input type='button' class='btn button-last btn-default' style="display:none;" name='last' value='Skip GG setup' />
            </ul>
        </div>
    </div>
</div>

因此，Bootstrap 向导有一个名为onNext. 现在在这个函数中，我试图找出用户点击了哪个按钮来触发这个事件。我尝试了如下代码所示的方法，但它并没有真正起作用。

$('#bootstrap-wizard-1').bootstrapWizard({
    'tabClass': 'form-wizard',
    'onNext': function (tab, navigation, index) {
        $("li.next").click(function() {
            var id = "";
            id = this.id; // or alert($(this).attr('id'));
            alert(id);
        });
    });
});
4

2 回答 2

0

您需要删除点击处理函数。您可以获取单击选项卡的索引。您的 HTML 不准确或不完整。检查文档。

检查这个jsfiddle示例。

更新：这样你就得到了身份证。提琴手

$('#bootstrap-wizard-1').bootstrapWizard({
    'tabClass': 'form-wizard',
    'onNext': function (tab, navigation, index) {
        //
    }
});

$("li.next").click(function(event) {
    console.log(event.target.id);   // get the id
});
于 2014-06-17T00:30:59.783 回答
0

我现在无法访问向导文档，但我认为这是您需要做的：

'onNext': function (tab, navigation, index) {
    var id = $(tab).attr('id');
    alert(id);
}

如果这不起作用，您可能可以使用索引来获取它：

'onNext': function (tab, navigation, index) {
    var id = $('.wizard > li').eq(index).attr('id');
    alert(id);
}

可能应该在 上放置一个 IDul以避免与选择器产生歧义。

于 2014-06-17T00:36:07.927 回答