Ссылка на конкретную вкладку

Question

Я веб-дизайнер / css / html-кодер с небольшим опытом работы с jQuery. Я буду признателен за помощь в следующем сценарии. В основном у меня есть страница с 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.

Спасибо

Answer 1

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

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

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