2012-01-16 3 views
0

Я веб-дизайнер/css/html кодер, не имеющий большого опыта работы в jQuery. Я позабочусь о помощи по следующему сценарию. В основном у меня есть страница с 3 вкладками. Я хочу иметь возможность ссылаться на страницу формы из 3 разных URL-адресов, связывая их с соответствующей вкладкой, открытыми и выбранными.Ссылка на конкретную вкладку

Существующий JQuery является

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'); 
    }); 
}; 

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.

Благодаря

ответ

0

В связи вы создаете страницу, которую необходимо включать в себя идентификатор ресурса или строку запроса идентичности, какая вкладка должна быть открыто:

http://www.page.com/index.html#link1 (идентификатор ресурса) http://www.page.com/index.html?tab=link1 (строка запроса)

, а затем на странице с вкладками вам нужно использовать некоторый javascript для проверки наличия параметра. Вы можете получить доступ к этому с помощью location.href в javascript и indexOf, чтобы узнать, существует ли параметр. Исходя из этого, вы можете установить одну из вкладок как «активных»

+0

Спасибо за ваш ответ. Да, я понимаю, что мне нужно использовать строку запроса в моих ссылках. Как я использую javascript, который вы предложили на реальной странице, чтобы проверить параметр? – gek

Смежные вопросы