JQuery选项卡Ui没有禁用

时间:2011-07-01 23:39:01

标签: jquery jquery-ui jquery-ui-tabs

我尝试了很多但没有成功。我有3个标签。标签索引为0,1,2

加载页面时,应禁用第2个选项卡索引。 单击第一个选项卡索引时,应启用第三个选项卡索引。

现在我在第3个标签索引上,如果我转到0标签索引而不是2标签索引应该禁用。

所以

0 index = disbale 2rd index

1 index =启用第2个索引

2 index = enable 0,1 index

这就是我想要的。 当我在tab-1上时,下面的代码不起作用。不禁用索引2 :(

$('#Paymenttabs').tabs({
    select: function(e, ui) {
        var isValid = true;
        var num = 0;
        if (ui.panel.id == "tabs-1"){
            $('#Paymenttabs').tabs("disable",[2]);
        }else if (ui.panel.id == "tabs-2"){
            $('#Paymenttabs').tabs( "enable" , 2 )
        }else if (ui.panel.id == "tabs-3"){
            $('#Paymenttabs').tabs("option","disabled",[]);
        }
    }
});

1 个答案:

答案 0 :(得分:4)

我认为发生这种情况的原因是因为根据文件:

  

无法禁用所选标签。

因此,当您从 [tab3] 转到 [tab1] 时,您尝试停用 [tab3] ,您目前在。你可以通过设置一个小时间的定时器并在定时器完成后执行标签切换代码来解决这个问题。这将确保活动选项卡不是您尝试禁用的选项卡:

$('#Paymenttabs').tabs({
    select: function(e, ui) {
        setTimeout(function() {
            var isValid = true;
            var num = 0;
            if (ui.panel.id == "tabs-1") {
                $('#Paymenttabs').tabs("disable", 2);
            } else if (ui.panel.id == "tabs-2") {
                $('#Paymenttabs').tabs("enable", 2)
            } else if (ui.panel.id == "tabs-3") {
                $('#Paymenttabs').tabs("option", "disabled", []);
            }
        }, 10);
    }
});

以下是一个有效的例子:http://jsfiddle.net/Csq6x/