如何啓用jQuery UI的標籤只是一個標籤

Question

我爲創建asp.net使用jQueryUI的標籤選項卡，寫這個代碼來創建選項卡

<div id="tabs"> 
      <ul> 
       <li class="context-tab"><a id="recent-tab" href="#iframe1">Recent</a></li> 
       <li class="context-tab"><a id="popular-tab" href="#iframe2">Popular</a></li> 
       <li class="context-tab"><a id="random-tab" href="#iframe3">Random</a></li> 
       <li class="context-tab"><a id="question-tab" href="#iframe4">By Question</a></li> 

      </ul> 
      <iframe id="iframe1" src="Default3.aspx" style="width: 100%;" height="900"></iframe> 

      <iframe id="iframe2" src="Default4.aspx" style="width: 100%;"></iframe> 

      <iframe id="iframe3" src="Default5.aspx" style="width: 100%;"></iframe> 

      <iframe id="iframe4" src="Default6.aspx" style="width: 100%;"></iframe> 
     <a id="goNext" href="#" style="display: none;">Next</a> 
     </div> 

    <script> 
     $(function() { 
      var $tabs = $("#tabs"); 
      $tabs.tabs(); 
      $tabs.tabs("option", 'disabled', [1, 2, 3]); 
      function getSelectedTabIndex() { 
       return $tabs.tabs('option', 'selected'); 
      } 


      $("#goNext").click(function() { 
       var b = getSelectedTabIndex() + 1; 
       $tabs.tabs('enable', b); 
       $tabs.tabs('option', 'active', b); 
       $tabs.tabs('option', 'selected', b); 
      }); 
     }); 
    </script> 

我想只有一個選項卡可以在任何時間被激活，並所有其他選項卡不活動。請幫幫我。謝謝大家。

Demo

Answer 1

試試這個：

$("#goNext").click(function() { 
    var b = getSelectedTabIndex() + 1; 

    // Disable the rest of the tabs are not active 
    var c = $tabs.find("ul li").size(); 
    for (var i = 0; i < c; i++) { 
     $tabs.tabs("disable", i); 
    } 

    $tabs.tabs('enable', b); 
    $tabs.tabs('option', 'active', b); 
    $tabs.tabs('option', 'selected', b); 
});