JavaScript의 특정 탭에 연결

세 개의 탭 (tabs.html)이있는 견본 페이지가 있습니다. 다음과 같이 탭이 표시됩니다 자바 스크립트가 탭을 전환하는 데 사용JavaScript의 특정 탭에 연결

<ul class="tabs"> 
    <li><a href="javascript:tabSwitch('tab_1', 'content_1');" id="tab_1" class="active">Tab 1</a></li> 
    <li><a href="javascript:tabSwitch('tab_2', 'content_2');" id="tab_2">Tab 2</a></li> 
    <li><a href="javascript:tabSwitch('tab_3', 'content_3');" id="tab_3">Tab 3</a></li> 
</ul>

이다 : 나는 tabs.html에 연결할 때

function tabSwitch(active, number, tab_prefix, content_prefix) { 
    for (var i = 1; i < number+1; i++) { 
     document.getElementById(content_prefix+i).style.display = 'none'; 
     document.getElementById(tab_prefix+i).className = ''; 
    } 
    document.getElementById(content_prefix+active).style.display = 'block'; 
    document.getElementById(tab_prefix+active).className = 'selected';  
}

는 이제 기본적으로, 첫 번째 탭은 활성으로 설정됩니다. tabs.html에 연결된 다른 사이트의 링크를 만들 수 있습니까? 두 번째 또는 세 번째 탭이 강제로 활성화 되나요?

출처

2011-11-14 mkas

document.body.onload = function(){ 
    if (location.hash !== "") 
    { 
     var page = location.hash.match(/[0-9]/); 
     tabSwitch('tab_'+page, 'content_'+page); 
    } 
}

올바른 탭을 설정해야합니다. 다음 링크는 tabs.html?1 같은 URL에 옵션을 추가 한 다음 tabnumber의 온로드에 대한 window.location.search.substr(1)을 확인 http://www.example.com/tabs.html#tab_1

출처

2011-11-14 14:01:53

답장을 보내 주셔서 감사합니다.하지만 자바 스크립트 콘솔에 '문서 본문이 null'오류가 표시됩니다. – mkas

@mkas 페이지에 시체가 있습니까? O_o –

물론, 해결 방법을 모르기 때문에 [내 사이트] (http://krill.olimp-labs.com/gold-krill.html)를보실 수 있습니까? – mkas

네 같은 것

출처

2011-11-14 14:02:54 borrel

당신은 tabs.html#tab1 같은 해시에서 추가 할 탭을 얻기 위해 시도 할 수 있습니다 . 그런 다음 페이지 온로드에서 실행되는 코드 블록에 이런 일을 수행

var hash = window.location.hash; 
if (hash == "#tab1") 
    tabSwitch('tab_1', 'content_1'); 
else if (hash == "#tab2") 
    tabSwitch('tab_2', 'content_2'); 
else if (hash == "#tab3") 
    tabSwitch('tab_3', 'content_3');

당신은 자바 스크립트를 배우고 스스로 그 일을하는 경우 나도 몰라,하지만하지 jQuery Tabs라는 jQuery 플러그인이있다 네가하려는 일을 정확하게.

출처

2011-11-14 14:03:19 mtrovo

JavaScript의 특정 탭에 연결

답변

관련 문제