用户界面 - jQuery UI 可折叠面板禁用选项卡

Question

如何在jQuery UI中禁用某些选项卡accordion()以便用户无法单击以打开选项卡的内容。假设我想禁用以下示例中的第二个选项卡。

http://jsfiddle.net/3JAkv/8/

Answer 1

也许我错了，
但是，如果我将类"UI-状态禁用"添加到所需的标头中，则标头/选项卡不再可选。

我正在与：
jquery-ui-1.10.3 和 jquery-1.7.1

Answer 2

在 1.8.x 中没有捆绑的方法可以做到这一点。

在

1.9 版（在撰写本文时提供 beta 版本）中，beforeActivate 事件看起来可以处理并返回false以防止激活发生。假设您在禁用部分的标题上设置了.data('enabled', false)，您可以在 1.9 中执行以下操作：

$('.ui-accordion').bind('accordionchangestart', function(event, ui) {
  if(ui.newHeader and !ui.newHeader.data('enabled')) {
    return false;
  }
  // fall through activation happens as normal
});

Answer 3

我正在粘贴一个带有受控导航手风琴示例的 JSFriddle。这意味着，用户不能跳过步骤或自由导航手风琴，而只能通过可以通过jQuery激活或放置的硬编码按钮。希望对您有所帮助。https://jsfiddle.net/moriz/rvuwze6s/

基本上js是这样的：

 $(function() {
     $("#accordion").accordion({
         disabled: true
     });
 });
 function operateAccordion(tabNumber) {
     $("#accordion").accordion("option", "active", tabNumber);
 }

按钮应该是这样的：

<a href="javascript:operateAccordion(1)">Next step</a>

考虑到手风琴部分从0开始编号.因此，此按钮可用于在导航中后退或前进。