Question

我有这些简单的标签：

<div class="ftabs">                    

<ul id="tabs" class="tabs nav nav-tabs nav-justified" data-tabs="tabs">
    <li  id='an'><a href="#anag" data-toggle="tab"><h3>Dati Anagrafici</h3></a></li>
    <li id='ind'><a href="#indirizzi"  data-toggle="tab"><h3>Indirizzi</h3></a></li>
    <li id='ref'><a href="#referenti" data-toggle="tab"><h3>Referenti</h3></a></li>
    <li id='ban'><a href="#blue" data-toggle="tab"><h3>Banche</h3></a></li>
</ul>

我可以用jQuery打开我想要的标签，例如：

$("#ref a[href='#referenti']").tab('show');

但我想禁用前两个标签。我试过这种方式，但它不起作用：

$('#tabs').tabs('option', 'disabled', [0, 1]);

为什么呢？我怎么能这样做？

Answer 1

您无法禁用活动标签，因此需要将第3个标签设置为有效，然后禁用前两个

From Docs：

The selected tab cannot be disabled.

所以

jQuery(function ($) {
    $("#tabs").tabs({
        active: 2,
        disabled: [0, 1]
    });
});

演示：Fiddle

稍后以编程方式禁用选项卡

$("#tabs").tabs("option", "active", 2)
$("#tabs").tabs("option", "disabled", [0, 1]);

演示：Fiddle

Answer 2

我会使用jquery index()（http://api.jquery.com/index/）函数。有了它，你可以找到你传递的元素的索引作为参数这样做：

//selector could be wrong but you have the use logic
$(".tabs > li").click(function() {
    if ($(".tabs > li").index($(this)) > 1) {
        $(this).tab('show');
    }
});

如何在JQuery选项卡上禁用click事件？

2 个答案: