같은 탭에 포커스가 있습니다

Question

jquery UI를 사용하여 탭을 만듭니다. 요구 사항은 내가 tab2 또는 다른 탭을 선택하고 페이지를 새로 고침/새로 고칠 때 포커스가 선택된 탭에 있어야합니다. 바이올린을 찾으십시오. http://jsfiddle.net/CnEUh/500/

많은 온라인 포럼을 방문했지만 예상 한 결과를 얻을 수 없습니다. 나는 Set Jquery ui active tab on page load/reload 링크를 따라 갔지만 결과를 얻지 못했습니다.

$(document).ready(function() { 
     $("#tabs").tabs({active: tabs-2}); 
     // Set active tab on page load 
     var SelectedTab = tabs-2; 
    if(tabSelectedId!=""){ 
     $("#tabs").tabs({selected: tabSelectedId}); 
     } 
    }); 

내가 페이지를 다시로드에서 선택한 탭에 포커스를 유지하는 방법을 제안하십시오 :

는 아래의 코드를 시도했다. 내 바이올린 http://jsfiddle.net/CnEUh/500/

Answer 1

당신은 단지 # 탭 = 2를 추가 한 다음 페이지로드, 여기 당신이 같이 location.href를 검색하고 선택하는 TAV 선택할 수 있습니다, 클릭에

을 같이 location.href 사용하여 수행 할 수 있습니다.

Answer 2

추가 jquery.cookie.js 라이브러리와 다음 코드는

$(document).ready(function() { 
var $tabs = $("#tabs").tabs({ 
      activate: function(event ,ui){ 
       $.cookie('active_tab', ui.newTab.index(), { path: '/' }); 
      } 
     }); 
     var selectedIndex=parseInt($.cookie('active_tab')); 
     if(selectedIndex) { 
      $tabs.tabs({ active: selectedIndex }); 
      $('#tabs').find("ul:first li:nth-child(" + (selectedIndex + 1) + ")").find('a').trigger('click'); 
     } 
     // set cookie on tab select 
}); 

또는 jquery.cookie.js없이

,

var activeTab; 
var $tabs = $("#tabs").tabs({ 
    activate: function (event, ui) { 
     activeTab = ui.newTab.index(); 
    } 
}); 

var params = {}; 

if (location.search) { 
    var parts = location.search.substring(1).split('&'); 
    for (var i = 0; i < parts.length; i++) { 
     var nv = parts[i].split('='); 
     if (!nv[0]) continue; 
     params[nv[0]] = nv[1] || true; 
    } 
} 

// Now you can get the parameters you want like so: 
var selectedIndex = parseInt(params.selectedIndex); 
if (selectedIndex) { 
    $tabs.tabs({ 
     active: selectedIndex 
    }); 
    $('#tabs').find("ul:first li:nth-child(" + (selectedIndex + 1) + ")").find('a').trigger('click'); 
} 

$('#tabs').click(function() { 
    window.location.href = window.location.href.replace(/[\?#].*|$/, "?selectedIndex="+activeTab); 
}); 

이 희망 작동 매개 변수로 활성 탭 인덱스를 전달합니다. 감사합니다.