jqueryui 选项卡 (1.9.1) 在加载时激活

Question

我有这样的代码:

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“按设计”声明 (http://bugs.jqueryui.com/ticket/8735)，activate首次绘制选项卡时不处理事件；或者当您设置.tabs("option","active",enTabs.Layout)时因为如果当前索引与您设置的选项/事件匹配，则 activate 不会触发，并且它被初始化为零。

确保首次绘制选项卡时，为第一个(第 0 个)选项卡触发“激活”的最佳方法是什么，意识到我不想绑定(bind)到“创建”，因为我不想在选项卡上加载数据直到实际单击它们？

我没能做到

$("#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 tabs 1.10.0 activate is not called after creation