我正在WordPress自定义页面上,我已经在自定义模板页面中添加了jquery ul tabs
。
1)现在,单击父选项卡的子选项卡后,如何在选项卡面板中获取内容?
2)First
标签应该处于打开状态,直到单击另一个sub-tabs
为止。
3)问题是,当我根据static content
添加了content
标签并显示sub tab id
却没有显示dynamic content
的jquery标签时。动态单击sub-tab
后没有显示任何内容?
**Jquery**
<script type="text/javascript">
window.onload=function(){
$(function() {
$( "#tabs" ).tabs();
});
$(document).ready(function() {
$(".menu a").click(function(){
$(".video").each(function(){
$(this).get(0).pause();
})
});
//tabbing selection
$(".menu li:eq(0)").addClass("active");
$(".menu li").click(function(){
$(this).addClass('active');
$(this).siblings().removeClass('active');
});
$(".tabs").click(function(){
$(".subtabsinner").slideUp();
$(this).siblings().removeClass('active');
});
$(".subtabs").click(function(){
$(this).nextUntil("li.parent").slideToggle();
$(this).removeClass('active');
$(this).next().addClass('active');
});
});
}
</script>
<div class="container">
<div id="tabs" style="display: inline-flex;">
<div class="row">
<div class="col col-lg-3 col-md-3">
<div class="leftmenu">
<div class="menu">
<ul class='resourcepage'>
<?php
$terms = get_terms('resourcecategories');
if ( !empty( $terms ) && !is_wp_error( $terms ) ){
//parent tab name
foreach ( $terms as $term ) {
echo "<li class='parent subtabs tabsclose'><span>" . $term->name . "</span></li>";
$music_args = array(
'post_type' => 'resourceverticaltabs',
'orderby' => 'title',
'order' => 'ASC',
'hierarchical' => false,
'resourcecategories' => $term->name
);
//sub tab name
$musicians = get_posts($music_args);
foreach ($musicians as $musician) {
echo ' <li class="subtabsinner"><a href="#'.$musician->ID.'">'.$musician->post_title.'</a></li>';
}
}
}?>
</ul>
</div>
</div>
</div>
<div class="col col-lg-8 col-md-8">
//tab content
<div class="rightmenu">
<?php $musicians = get_posts($music_args); foreach ($musicians as $musician) {?>
<div id="<?php echo $musician->ID ?>" style="border:2px solid red">
<?php echo $musician->the_content ?>
</div>
<?php } ?>
</div>
</div>
</div>
</div>
</div>
静态内容链接 Static Content