Вкладки пользовательского интерфейса jQuery отключают навигацию по вкладкам

Question

Я пытался отключить навигацию по вкладкам, используя

var $tabs = $("#tabs").tabs({
    select: function(event, ui) { return false; }
});

Однако это также отключает ссылки на потоки, которые я использую для навигации:

$('input.nexttab').click(function() {
    var tab_num = $tabs.tabs('option', 'selected');
    // error check this tab before proceeding
    if ( check_tab(tab_num) ) {
        $tabs.tabs('select', tab_num + 1 );
    }
});

В идеале, я бы хотел отключить навигацию по вкладкам для вкладок справа от текущей вкладки и обеспечить постоянную работу кнопок навигации моих вкладок << предыдущая и следующая>.

Есть предложения?

Answer 1

Вы пытались установить для параметра события значение, которое вряд ли будет запущено (если оно вообще есть)?

Например:

$('#tabs').tabs({ event: 'change' });

или

$('#tabs').tabs({ event: '' }); //probably better

Answer 2

Вы должны сохранить флаг на первом закрытии, в функции, которую вы передаете $(document).ready, установить его в значение true, когда нажимаются кнопки Next / prev, и установить в значение false, когда вкладка была показана, выполнив это. , вы сможете изменить вкладку только с помощью кнопок.

Проверьте этот рабочий образец и следующий фрагмент кода:

$(document).ready(function(){ 
  var allowTabChange = false; 
  var $myTabs = $("#tabs"); 

  $myTabs.tabs({ 
                    select: function(event, ui) { return allowTabChange; }, 
                    show: function(event, ui) { allowTabChange = false; }, 
               }); 

  $('#nextButton').click(function(){offsetTab(1);}); 
  $('#prevButton').click(function(){offsetTab(-1);}); 

  // Helper functions

  function offsetTab(offset){ 
    var tab_num = $myTabs.tabs('option', 'selected'); 
    var nextTab = tab_num + offset; 

    if ( check_tab(nextTab) ) { 
      allowTabChange = true; 
      $myTabs.tabs('select', nextTab); 
    } 
  }

  function check_tab(tab_num){        
    return tab_num >= 0 && tab_num < $myTabs.tabs('length'); 
  } 
});