加载时禁用Jquery UI选项卡

时间:2011-12-01 11:47:09

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

我目前有这段代码:

    $( ".feature-tabs" ).tabs( 
{ collapsible: true, fx: [{opacity:'toggle', duration:'slow', height: 'toggle'},   // hide option 
{opacity:'toggle', duration:'slow', height: 'toggle'}]}); // show option

我希望在页面加载时将标签设置为禁用,但我遇到了问题。我尝试在选项中添加disabled:true但无法使其工作。

有人可以告诉我正确的方法吗?谢谢你的帮助

编辑:标签的HTML:

<div class="feature-tabs" id="tabs-set">
    <ul>
        <li><a href="#tabs-1" id="tab1">How does it<br/>work?</a></li>
        <li><a href="#tabs-2" id="tab2">Heating Start<br/>Time</a></li>
        <li><a href="#tabs-3" id="tab3">Turning on<br/>the boiler</a></li>
    </ul>
    <div id="tabs-1">
        <p>test</p>
        </div>
    <div id="tabs-2">
        <p>test2</p>        
                </div>
    <div id="tabs-3">
        <p>test3</p>
        </div>
</div>

3 个答案:

答案 0 :(得分:3)

你应该使用

disabled: [1, 2] 

其中数组的数量是要禁用的选项卡(从0开始),以便禁用第二个和第三个选项卡

编辑你的案例

$(".feature-tabs").tabs({
    disabled: [0, 1, 2],
    collapsible: true,
    fx: [{
        opacity: 'toggle',
        duration: 'slow',
        height: 'toggle'}, // hide option  
         {opacity: 'toggle',
        duration: 'slow',
        height: 'toggle'}]
}); // show option

在这里摆弄http://jsfiddle.net/WqPtr/

答案 1 :(得分:0)

您是否尝试停用JQuery UI Site

上给出的每个标签
$( ".selector" ).tabs({ disabled: [1, 2] });

答案 2 :(得分:0)

您需要将禁用值设置为一个数组,并禁用每个选项卡的索引 - 选项卡为零索引。

有关详细信息,请参阅http://jqueryui.com/demos/tabs的选项标签中的已停用内容。