2013-03-21 30 views
0

我正在使用Jquery Ui選項卡framework.I想要更改所選的選項卡accore按瀏覽器中的URL模式,如www.xyz.com/#tab1或www.xyz.com/# TAB2。根據URL模式更改UI選項卡

我發現使用

$("#tabs").bind('tabsselect', function(event, ui) { 
       window.location.href=ui.tab; 

但是,它正在選定的標籤錨,但實際上並沒有改變標籤,我必須按回車鍵實際更改標籤解決方法。有人可以指出我錯了什麼地方,並且可以提示更改,以便標籤更改符合URL模式。

我使用下面的代碼來實現這個

$(document).ready(function() { 




    $("#tabs").tabs({ 
     beforeLoad: function(event, ui) 
      {   
      ui.jqXHR.error(function() { 
        ui.panel.html(   "Couldn't load this tab. We'll try to fix this as soon as possible. " ); 
          }); 
           }  
           }); 

      $("#tabs").bind('tabsselect', function(event, ui) { 
      window.location.href=ui.tab; 

     }); 

}); 

HTML代碼

<div id="tabs"> 
<ul> 
    <li><strong class="first"> 
    <a href="#tabs1" id="tab1">Tab-1</a> 
    </strong></li> 
<li> 
<strong> 
<a href="xyz.do" id="tab2">Tab-2</a> 
</strong> 
</li> 

</ul> 

<div id="tabs1"> 
tab -1 content 
</div> 

回答

0

我想你可能想通過激活處理程序綁定。 http://api.jqueryui.com/tabs/#event-activate

$(".selector").on("tabsactivate", function(event, ui) { changeColor(ui); }); 

ui.tab將有大約被點擊選項卡中的細節。

在你的情況下,我想你會想說

var changeColor(ui) = function(
    if (ui.index == 1) { 
     $("#selector").addClass("tab2Active"); 
    }); 
相關問題