Javascript 탭에 대한 링크

Question

다음 코드로 작업하는 전체 탭 시스템을 보유하고 있습니다. A LI 링크를 클릭하면 다른 div가 숨겨지고 선택한 div가 표시됩니다.

<script type="text/javascript"> 
    //<![CDATA[ 

    var tabLinks = new Array(); 
    var contentDivs = new Array(); 

    function init() { 

     // Grab the tab links and content divs from the page 
     var tabListItems = document.getElementById('tabs').childNodes; 
     for (var i = 0; i < tabListItems.length; i++) { 
     if (tabListItems[i].nodeName == "LI") { 
      var tabLink = getFirstChildWithTagName(tabListItems[i], 'A'); 
      var id = getHash(tabLink.getAttribute('href')); 
      tabLinks[id] = tabLink; 
      contentDivs[id] = document.getElementById(id); 
     } 
     } 

     // Assign onclick events to the tab links, and 
     // highlight the first tab 
     var i = 0; 

     for (var id in tabLinks) { 
     tabLinks[id].onclick = showTab; 
     tabLinks[id].onfocus = function() { this.blur() }; 
     if (i == 0) tabLinks[id].className = 'selected'; 
     i++; 
     } 

     // Hide all content divs except the first 
     var i = 0; 

     for (var id in contentDivs) { 
     if (i != 0) contentDivs[id].className = 'tabContent hide'; 
     i++; 
     } 
    } 

    function showTab() { 
     var selectedId = getHash(this.getAttribute('href')); 

     // Highlight the selected tab, and dim all others. 
     // Also show the selected content div, and hide all others. 
     for (var id in contentDivs) { 
     if (id == selectedId) { 
      tabLinks[id].className = 'selected'; 
      contentDivs[id].className = 'tabContent'; 
     } else { 
      tabLinks[id].className = ''; 
      contentDivs[id].className = 'tabContent hide'; 
     } 
     } 

     // Stop the browser following the link 
     return false; 
    } 

    function getFirstChildWithTagName(element, tagName) { 
     for (var i = 0; i < element.childNodes.length; i++) { 
     if (element.childNodes[i].nodeName == tagName) return element.childNodes[i]; 
     } 
    } 

    function getHash(url) { 
     var hashPos = url.lastIndexOf ('#'); 
     return url.substring(hashPos + 1); 
    } 

    //]]> 
    </script> 

이 링크를 통해 탭을 열 수 있기를 원합니다. 그래서 내가 index.php#hello을 방문하면 id가 hello 인 div에 링크됩니다. 간단히 링크를 방문해 보았지만 작동하지 않았습니다 ... 고맙습니다.

Answer 1

당신은 페이지로드 init()를 실행한다고 가정하면, 단지 함수 내에서 다음을 추가

if(window.location.hash) 
    showTab(); 

을 당신은하지 않을 경우 페이지가 열려 적절한 탭을 설정하기 위해 링크를 클릭 할 때 showTab()가 실행하는 기능을 가지고 있지만, 로드하므로 코드를 실행할 수 없습니다. 해시 위치가있는 경우 한 번 실행하면 필요한 것을 얻을 수 있습니다.