Динамические вкладки - Link работает только при нажатии

Question

Так я попробовал этот учебник и вкладки работают безотказно:

http://www.w3schools.com/bootstrap/tryit.asp?filename=trybs_tabs_dynamic&stacked=h 

Но проблема заключается в следующем:

Я могу нажать на вкладках и navigate, но если я использую ссылку непосредственно на определенной вкладке, она откроет первую (по умолчанию) вкладку.

Пример:

прилагая # menu2 не открывает вкладку назначенную с идентификатором # menu2 при посещении ссылки http://www.w3schools.com/bootstrap/tryit.asp?filename=trybs_tabs_dynamic&stacked=h#menu2

Спасибо!

Answer 1

Может быть, вы должны попробовать это:

$(document).ready(function() { 
    var hash = document.location.hash; 
    if(hash.length > 1) { 
    $("a[href='" + hash + "']").trigger("click"); 
    } 
}); 

Он проверяет, есть ли хэш при открытии документа, а затем нажимает на правильную ссылку

Если добавить его между «<script></script>» в «tryit» и нажмите «Просмотреть результаты», вы увидите, что это произойдет. Ex:

Answer 2

Это потому, что меню бутстрапов работает через javascript, а не через фактические привязки.

При нажатии на вкладку Javascript активизируется функция, которая устанавливает в active класс на вкладке и панели содержимого, что приведет к вкладке быть выделены и содержание, чтобы быть display: block и не display: none больше (это значение по умолчанию).

Вам нужно будет прочитать якорь из URL-адреса при создании страницы, а затем установить классы active в зависимости от этого.

Дополнение В качестве альтернативы можно использовать Фрагмент кода JavaScript, как предложено @VirginieLGB, но тогда вы будете иметь короткий момент перехода каждый раз, когда страница загружена. Особенно, когда у вас большая страница, которая занимает больше времени для загрузки, вам, возможно, придется немного подождать, чтобы документ был «готов», чтобы функция начала работать. В этот промежуток времени первая вкладка будет отображаться перед переходом и отображением второй вкладки.

Answer 3

Я думаю, что вы просите это: При нажатии на вкладку, которую вы хотите новую страницу, чтобы открыть и активную вкладку, чтобы показать.

css указывает, что активная вкладка имеет класс. Active , вам нужно добавить активный класс к соответствующей вкладке на вновь открытой странице.