2011-11-03 47 views
0

我在添加一個類到我目前在Wordpres中使用的一些jQuery標籤時遇到了問題。以下代碼創建了一個用於創建選項卡的簡碼。我的問題是如何添加一個類到正在顯示的選項卡中的「活動」選項卡。我希望能夠將此類添加到正在顯示的選項卡中,以便我可以使用CSS進行設計。下面是我目前使用的,它的工作原理找到的代碼,但它不會增加類的活動標籤:通過Wordpress簡碼製作的標籤

add_shortcode('tabgroup', 'jqtools_tab_group'); 
function jqtools_tab_group($atts, $content){ 
$GLOBALS['tab_count'] = 0; 

do_shortcode($content); 

if(is_array($GLOBALS['tabs'])){ 
foreach($GLOBALS['tabs'] as $tab){ 
$tabs[] = '<li><a class="" href="#">'.$tab['title'].'</a></li>'; 
$panes[] = '<div class="pane"><h3>'.$tab['title'].'</h3>'.$tab['content'].'</div>'; 
} 
$return = "\n".'<!-- the tabs --><ul class="tabs">'.implode("\n", $tabs).'</ul>'."\n".'<!-- tab "panes" --><div class="panes">'.implode("\n", $panes).'</div>'."\n"; 
} 
return $return; 
} 

add_shortcode('tab', 'jqtools_tab'); 
function jqtools_tab($atts, $content){ 
extract(shortcode_atts(array(
'title' => 'Tab %d' 
), $atts)); 

$x = $GLOBALS['tab_count']; 
$GLOBALS['tabs'][$x] = array('title' => sprintf($title, $GLOBALS['tab_count']), 'content' =>  $content); 

$GLOBALS['tab_count']++; 
} 

感謝。

回答

0

如果您使用jquery/javascript來添加類,會更好。

如果您確定哪些選項卡在頁面加載時處於活動狀態,則可以通過jquery動態添加活動類。

$(document).ready(function() { 
// That is if the first tab is the default active tab. 
// Assuming the li tag is what you want to apply the 'active' class on 
$('ul.tabs li:first').addClass('active'); 

// Manipulate Class on click event. 
// Assuming the li tag is what you want to apply the 'active' class on 


$('ul.li a').click(function() { 
// Remove any 'active' class previously added. 
$(this).parent().siblings().removeClass('active'); 

// Add 'active' class to the selected tab. 
$(this).parent().addClass('active'); 

}); 
}); 

希望這有助於。

+0

這工作!對你的代碼做了一些微小的調整,但是如果沒有它,我想我不會這樣做,謝謝很多人!乾杯 –