[英]Using jQuery tabs to show hide additional content
我们在页面中心列使用五个选项卡,用于显示/隐藏内容。
在我们的右侧列中,只有选择选项卡一时,该内容才会出现(这是页面加载时的默认名称,称为“ #overview”)。
如何确保在选择选项卡2、3、4或5时,此右div设置为display:none? 不幸的是,我不能在选项卡1的内容中包含这是一个简单的解决方案-它必须显示在右栏中。
我要隐藏的类是“ kis-widget
”(选择#overview时),我们的显示/隐藏代码是:
$(document).ready(function()
{
if (window.location.hash)
{
show(window.location.hash);
}
else
{
show('#overview');
}
});
function show(id)
{
$('#overview_div, #coursecontent_div, #profiles_div, #requirements_div, #fees_div').hide();
$('#tabs li a').removeClass("selected");
$(id + '_div').show();
$(id + '_link').addClass("selected");
}
将不胜感激。
谢谢
尼尔
如何确保在选择选项卡2、3、4或5时,此右div设置为display:none?
遵循以下原则:
DOM:
TAB 1 .tab .tab-first
TAB 2 .tab
TAB 3 .tab
TAB 4 .tab
TAB 5 .tab
代码如下:
function hiderighthanddiv(evt)
{
//whatever you want
}
function showrighthanddiv(evt)
{
//whatever you want
}
$('.tab').not('.tab-first').bind('click',hiderighthanddiv);
$('.tab-first').bind('click',showrighthanddiv);
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.