Question

我的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);
        });
    });
});

Answer 1

您需要删除点击处理程序功能。您可以获取所单击选项卡的索引。您的HTML不准确或不完整。 Check the documentation

请查看此jsfiddle示例。

更新：这样您就可以获得ID。 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
});

Answer 2

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

'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);
}

应该在ul上放置一个ID，以避免选择器出现歧义。

无法找到调用jquery函数的按钮的id？

2 个答案: