2016-07-04 6 views
0

Я использую jQuery ниже, чтобы создавать вкладки на моем веб-сайте (например, вкладки в пределах вкладок), но я бы хотел, чтобы по умолчанию никаких активных вкладок не было. Все вкладки должны быть закрыты при первом посещении страницы.Закладки Jquery без активной активной вкладки

Я вижу комментарий об установке начальной активной вкладки ниже, но я не могу понять, что нужно изменить/удалить, чтобы это не было сделано. Может ли кто-нибудь помочь?

jQuery('ul.tabs').each(function(){ 
// For each set of tabs, we want to keep track of 
// which tab is active and it's associated content 
var $active, $content, $links = jQuery(this).find('a'); 

// If the location.hash matches one of the links, use that as the active tab. 
// If no match is found, use the first link as the initial active tab. 
$active = jQuery($links.filter('[href="'+location.hash+'"]')[0] || $links[0]); 
$active.addClass('active'); 

$content = $($active[0].hash); 

// Hide the remaining content 
$links.not($active).each(function() { 
    jQuery(this.hash).hide(); 
}); 

// Bind the click event handler 
jQuery(this).on('click', 'a', function(e){ 
    // Make the old tab inactive. 
    $active.removeClass('active'); 
    $content.hide(); 

    // Update the variables with the new link and content 
    $active = jQuery(this); 
    $content = jQuery(this.hash); 

    // Make the tab active. 
    $active.addClass('active'); 
    $content.show(); 

    // Prevent the anchor's default click action 
    e.preventDefault(); 
}); 
}); 

Live Demo

+0

Не могли бы вы включить Live Demo пожалуйста – Li357

+0

@AndrewL. Да, демо-версия здесь: http://jsfiddle.net/rohankumar1524/x5528/ – curiousk

+0

Пожалуйста, не используйте ненужные теги ... –

ответ

1

Изменить следующее:

$links.not($active).each(function() { 
    jQuery(this.hash).hide(); 
}); 

Для

$links.each(function() { 
    jQuery(this.hash).hide(); 
}); 

Или удалить этот код и CSS скрыть все содержание, которое лучше не мигает содержимое перед у сценария есть шанс его скрыть

.tab_content {display;none} 

DEMO

+0

Спасибо, что работает, однако он оставил активный класс по первому элементу, заставляя его выглядеть как активный элемент, хотя это не так. Можно ли это исправить? – curiousk

+0

удалить первый экземпляр '$ active.addClass ('active');' – charlietfl

+0

Да, это трюк, большое вам спасибо. :) – curiousk