问题
I have a wordpress theme that has a build in shortcode for creating an tabbed interface. The problem is that I can't link from an external page to a specific tab. I saw that there are multiple questions about the same issue, but no answer worked for me. I have to mention that my javascript / jQuery skills are close to zero so even if this might seem simple, I have no idea what to do.
I found the jQuery code responsible for the accordion tabs in a file in my theme, here it is:
// ---------------------------------------
// TAB
// ---------------------------------------
function base_tab() {
$('.tabs-wrap').each(function(){
var tab_group = $('.tabs-wrap');
$('.tabs li', tab_group).click(function(e){
e.preventDefault();
$('.tabs a', tab_group).removeClass('current');
$('a', this).addClass('current');
$('.panes .pane', tab_group).hide();
$('.panes .pane', tab_group).eq($(this).index()).show();
});
// Trigger Initial Tab
var initial_tab = parseInt( $('.tabs', this).attr('initial-tab') );
$('.tabs li', tab_group).eq(initial_tab).trigger('click');
});
}
As far as I understood from previous, similar questions I need to add this code but I can't figure out on my own where and how to make it work:
$(window.location.hash).click();
All the links to the tabs are currently like this: http://www.websitename.com/page/#
I'll appreciate any help, thanks!
回答1:
First change your html into this
<ul class="tabs" initial-tab="0">
<li><a href="#all">All</a></li>
<li><a href="#kids">Kids Place – Kidproof</a></li>
<li><a href="#baby">Baby Rattle Toy</a></li>
<li><a href="#kidsvideo">Kids Place Video Player</a></li>
<li><a href="#letter">Letters With Ally</a></li>
<li><a href="#mommy">Mommy bird and her chick</a></li>
</ul>
Then write some extra code
$(function(){
var hash = window.location.hash;
var anchor = $('a[href$="'+hash+'"]');
if (anchor.length > 0){
anchor.click();
}
});
来源:https://stackoverflow.com/questions/11333436/how-to-link-directly-to-jquery-accordion-tab