Question

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

Answer 1

也许我错了，
但如果我将“ui-state-disabled”类添加到所需的标题，则标题/标签不再可选。

我正在使用：
jquery-ui-1.10.3和jquery-1.7.1

Answer 2

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

在版本1.9（测试版本在撰写本文时可用）中，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开始编号。因此，此按钮可用于在导航中返回或返回。

jQuery UI Accordion禁用选项卡

3 个答案: