jqueryui选项卡（1.9.1）在加载时激活

我有这样的代码：

var enTabs = { "Layout": 0, "Edit": 1, "Stuff": 2 } $("#tabs").tabs({ activate: function (event, ui) { switch (ui.newTab.index()) { case enTabs.Layout: // loads remote data, processes it, draws it to this tab; break; case enTabs.Edit: // loads remote data, processes it, draws it to this tab; break; case enTabs.Stuff: // loads remote data, processes it, draws it to this tab; break; } } }).tabs("option","disabled",[enTabs.Edit,enTabs.Stuff]); console.log("active tab", $("#tabs").tabs("option","active")); // says "0" 

根据jQuery“by design”声明（ http://bugs.jqueryui.com/ticket/8735 ），首次绘制选项卡时不会处理activate事件; 或者，当您设置.tabs("option","active",enTabs.Layout)如果当前索引与您设置的选项/活动匹配，则激活不会触发，并且它初始化为零。

确保在第一次绘制选项卡时，为第一个（第0个）选项卡触发’activate’的最佳方法是什么，意识到我不想绑定到’create’，因为我不想加载数据在标签上直到它们实际被点击？

我无法做到

 $("#tabs").tabs( "option", "active", -1 ).tabs( "option", "active", enTabs.Layout) 

一贯工作。

Answer 1

你可以使用这样的东西

 function loadTab(index) { switch (index) { case enTabs.Layout: // loads remote data, processes it, draws it to this tab; break; case enTabs.Edit: // loads remote data, processes it, draws it to this tab; break; case enTabs.Stuff: // loads remote data, processes it, draws it to this tab; break; } } $(function () { $("#tabs").tabs({ create: function (event, ui) { loadTab(ui.tab.index()) }, activate: function (event, ui) { loadTab(ui.newTab.index()) } }); }); 

这里有一个类似的问题JQuery UI标签1.10.0激活在创建后没有被调用

Answer 2

这是一种在页面加载时触发激活function的方法：

 $('#tabs') .tabs({ active: false, collapsible: true, activate: function(){console.log('Tab activated');} }) .tabs('option', 'active', 0) .tabs('option', 'collapsible', false); 

阐释：

JQuery选项卡使用选项进行初始化

• collapsible:true //需要使用选项active：false
• active:false //表示没有可见的标签（全部折叠）

然后，我们立即激活我们想要在pageload上看到的选项卡

• .tabs('option', 'active', 0) //这里标签0被激活，但也可能是其他标签

最后我们删除了可折叠选项（如果你不想要它……）

• .tabs('option', 'collapsible', false)