Блог

Главная - Вопросы по программированию - jQuery UI Accordion отключить вкладку

jQuery UI Accordion отключить вкладку

#jquery #user-interface #accordion

#jquery — jquery — запрос #пользовательский интерфейс #аккордеон #jquery

Вопрос:

Как я могу отключить определенные вкладки в jQuery UI accordion() , чтобы пользователь не мог щелкнуть, чтобы открыть содержимое вкладки. Допустим, я хочу отключить вторую вкладку в примере ниже.

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

Ответ №1:

Возможно, я ошибаюсь,
но если я добавлю класс «ui-state-disabled» в нужный заголовок, заголовок / вкладку больше нельзя будет выбрать.

Я работаю с:
jquery-ui-1.10.3 и jquery-1.7.1

Комментарии:

1. Я тоже этим пользуюсь :-). Работает как шарм.

Ответ №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
});

Комментарии:

1. Спасибо, но мне это немного непонятно. Что такое disabled_header. Можете ли вы выполнить это по ссылке jsfiddle, которую я предоставил выше.

2. disabled_header — это просто заполнитель для некоторого индикатора, который вы хотите отключить в заголовке. Это может быть класс, указывающий состояние ( ui.newHeader.hasClass('disabled') ) или какое-либо состояние, сохраняемое в переменных Javascript. Я просто хотел быть уверенным , что вы знали, что значение return false означает false , а не "false" .

3. Возможно, вместо этого вам следует рассмотреть виджет вкладок jQueryUI, поскольку отключенные вкладки являются встроенной опцией. $('#tabs').tabs('disable', tab_id_or_index) и $('#tabs').tabs('enable', tab_id_or_index)

4. возврат false не останавливает открытие accordion

5. Вероятно, я читал код для 1.9, который позволяет отменить событие accordion changestart: github.com/jquery/jquery-ui/blob/master/ui / … В 1.8 нет: github.com/jquery/jquery-ui/blob/1-8-stable/ui /…

Ответ №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. Таким образом, эта кнопка может использоваться для перехода назад или вперед в навигации.