Ссылка на якорь внутри содержимого с вкладками по внешней ссылке

Question

Ссылка на якорь в содержимом с вкладками от внешняя ссылкаGo to anchor. Скрипт должен быть добавлен как глобальный файл по всем страницам/шаблонам. Пример того, что у меня есть I have so far.

нажмите на <a goto="stuff" href="#test">Go to stuff</a>/который идет на третьей вкладке .

jsfiddle

Answer 1

Проблема заключается в том, что $ (window.location.hash) оценивает в $ ('# тест'), так это выглядит для элемента с ID = "тест". Такой элемент не существует на вашей странице.

Используя ссылку, как это:

http://www.canberra.edu.au/media/test/bookmark.html/#test

обычно указывают, что вы хотите, чтобы перейти к содержимому, помеченной именем якорный = «тест».

В вашем примере я могу видеть, по крайней мере, два якоря с тем же атрибутом имя:

<a name="test"></a> 

Это неправильно - имена анкерные должны быть уникальными:

http://www.w3.org/TR/html401/struct/links.html#idx-anchor-4

Так как только вы исправить это и имеет уникальное имя привязки, вы можете использовать href вместо вашего атрибута goto. Это также хорошая идея использовать как имя и идентификатор:

<a id="test" name="test"></a> 

который составит $ (window.location.hash) работать, как ожидалось.

Так что теперь это должно активировать правильную вкладку:

var $targetAnchor = $(window.location.hash); 
tabId = $targetAnchor.closest('.tab-content').attr('id'); 
$tabs.find('a[href=#' + tabId + ']').click(); 

И это должно работать для прокрутки:

$('html, body').animate({ 
    scrollTop: $targetAnchor.offset().top 
});