【问题标题】:Twitter bootstrap wizard differentiate next buttonTwitter 引导向导区分下一个按钮
【发布时间】:2016-02-02 14:07:27
【问题描述】:

我正在使用 twitter 引导向导创建一个具有四个选项卡的向导。 我需要在单击下一个按钮时关联一个操作,例如在第一个选项卡中,我有一个用户选择一行的表,因此我禁用了下一个按钮并在选择一行时启用。问题在于下一个选项卡,因为下一个按钮的 id 对于所有选项卡都是相同的,因此我无法为每个选项卡关联不同的操作。你能给我一个解决方案吗? 谢谢,这是我的 javascript 代码:

$(document).ready(function() {
$('#acquisitionWizard').bootstrapWizard({onTabShow: function(tab, navigation, index) {

    // Dynamically change percentage completion on progress bar
    var tabCount = navigation.find('li').length;
    var current = index+1;
    var percentDone = (current/tabCount) * 100;
    $('#acquisitionWizard').find('#progressBar').css({width:percentDone+'%'});

    // Optional: Show Done button when on last tab; 
    // It is invisible by default.
    $('#acquisitionWizard').find('.last').toggle(current >= tabCount);

    // Optional: Hide Next button if on last tab; 
    // otherwise it shows but is disabled
    $('#acquisitionWizard').find('.next').toggle(current < tabCount);
    $("#next").addClass("disabled");    

}});
$(function() {
    $("#next").click(
            function() {
...

【问题讨论】:

    标签: javascript jquery html twitter-bootstrap button


    【解决方案1】:

    已解决:我已解决删除点击事件并使用

    onNext: function(tab, navigation, index) {
            if (index==1){
    

    所以我使用索引将指令关联到一个标签

    【讨论】:

      【解决方案2】:

      我使用 Knockout.js 做了同样的事情,将当前步骤绑定到视图模型属性并根据其值执行不同的操作。

      【讨论】:

        猜你喜欢
        • 2015-10-13
        • 2018-08-16
        • 2012-08-22
        • 2012-05-26
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2016-05-17
        相关资源
        最近更新 更多