jquery добавить на страницу загрузки показать запрошенную функцию вкладки

Question

Я новичок в jquery, и я использовал этот код для вкладок

<script type="text/javascript" charset="utf-8">
    $(function () {
        var tabContainers = $('div.tabs > div');
        tabContainers.hide().filter(':first').show();

        $('div.tabs ul.tabNavigation a').click(function () {
            tabContainers.hide();
            tabContainers.filter(this.hash).show();
            $('div.tabs ul.tabNavigation a').removeClass('selected');
            $(this).addClass('selected');
            return false;
        }).filter(':first').click();
    });


</script>

Мне нужно иметь возможность загружать определенную вкладку при открытии URL-адреса, например: www.mysite.com/page.html#tab1

HTML ссылка выглядит следующим образом:

<a href="#tab1" class="selected">name link</a>
<a href="#tab2" class="">name link2</a>
<a href="#tab3" class="">name link3</a>

Я пробовал много скриптов, но, возможно, я виноват (я чувак с javascript)

Заранее спасибо

Answer 1

JQuery-UI имеет tab-widget Вы можете использовать.

Гораздо проще и стабильнее, чем писать свой.

Для различных URL-адресов, пожалуйста, посмотрите это сообщение .

В нем рассказывается, как использовать UI-темы и загружать различные URl.

В противном случае Вы должны выполнить $('#theIdOfTheDiv').load(url) для события щелчка на вкладке

Answer 2

1. Вам нужен такой якорь, как <a href="#tab1">click to see tab1</a>

2. Вам нужно перенаправить пользователя на # tab1, чтобы удалить строку return false; вашей функции, которая отключает перенаправление

3. Ваша функция запускается при нажатии <a>, вам нужно активировать ее еще раз при загрузке страницы

ваша функция будет выглядеть так

$(function(){
    onClickHandler = function() {
      $('div.tabs > div').hide();
      $(window.location.hash).show();
    }
    $('div.tabs ul.tabNavigation a').click(onClickHandler);
    onClickHandler();
});

Answer 3

window.location имеет атрибут hash. Таким образом, вы можете проверить это по пустой строке и, если она не пуста, выбрать эту вкладку:

if(!window.location.hash === "")
    $(window.location.hash).show();

Answer 4

Вкладка, которую вы хотите отобразить по умолчанию, должна иметь класс selected в вашем HTML. То же самое следует связать с оберткой содержимого. Остальные не должны.