특정 탭에 연결

Question

저는 jQuery에서 많은 경험이없는 웹 디자이너/CSS/HTML 코더입니다. 다음 스크립트에 대한 도움을 주시면 감사하겠습니다. 기본적으로 3 탭 폼 페이지가 있습니다. 3 개의 다른 URL에서 양식 페이지로 연결하고 해당 탭을 열어 선택하여 링크 할 수 있기를 원합니다.

기존 jQuery를

는 HTML을

<div class="component tab"> 
<nav id="nav"> 
    <ul class="tabset"> 
    <li><a class="active" href="#"><span>Option 1</span></a></li> 
    <li><a href="#"><span>Option 2</span></a></li> 
    <li><a href="#"><span>Option 3</span></a></li> 
    </ul> 
</nav> 
<div class="tab-wrapper"> 
<div id="1"> 
<form class="search" action="#"> 
<fieldset> 
    <header> 
    <h2>Heading 1</h2> 
    </header> 
    <div class="row-holder"> 
    <input id="checkbox7" class="checkbox" type="checkbox"> 
    <label for="checkbox7">Lorem ipsum</label> 
    </div> 
    </div> 
    </div> 
</fieldset> 
<div id="2"> 
<form class="search" action="#"> 
    <div class="form-wrapper"> 
    <fieldset> 
    <header> 
     <h2>Heading 2</h2> 
    </header> 
    <div class="row-holder"> 
     <input id="checkbox7" class="checkbox" type="checkbox"> 
     <label for="checkbox7">Lorem ipsum</label> 
    </div> 
    </div> 
    </div> 
    </fieldset> 
    </div> 
    <input type="reset" class="search" value="Clear"> 
    <input type="submit" class="search" value="Search"> 
</form> 
</div> 
<div id="3"> 
<fieldset> 
    <header> 
    <h2>Heading 3</h2> 
    </header> 
    <div class="row-holder"> 
    <input id="checkbox7" class="checkbox" type="checkbox"> 
    <label for="checkbox7">Lorem ipsum</label> 
    </div> 
    </div> 
    </div> 
</fieldset> 
</div> 
</div> 

사람이 내 JQuery와/html로 추가 할 필요가 무엇을 나에게 설명 할 수있다

function tabcomponent() { 
    $('.tabset li a').click(function (e) { 
     e.preventDefault(); 
     var index = $('.tabset li a').index(this) + 1; 
     var selector = 'div#' + index; 
     $('.tab-wrapper > div').hide(); 
     $('.tab-wrapper ' + selector).show(); 
     $('.tabset li a').removeClass('active'); 
     $(this).addClass('active'); 
    }); 
}; 

입니다.

감사

당신이 자원 식별자 또는 탭이 열려 있어야 정체성에 쿼리 문자열을 포함해야 페이지로 만드는 링크에서

Answer 1

:

http://www.page.com/index.html#link1 (리소스 식별자) http://www.page.com/index.html?tab=link1 (쿼리 문자열)

그리고 탭이있는 페이지에서 매개 변수의 존재를 확인하기 위해 일부 자바 스크립트를 사용해야합니다. javascript에서 location.href를 사용하고 param이 있는지 indexOf를 사용하여 액세스 할 수 있습니다. 이를 바탕으로 탭 중 하나를 '활성'으로 설정할 수 있습니다.