隐藏带有div的显示表 [英] Hide Show table with div
本文介绍了隐藏带有div的显示表的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我试图根据用户单击选项卡1或选项卡2的时间来显示和隐藏表.此刻我被困住了，可能需要一些帮助.我尝试了jquery和ajax控件工具包，但两者均不适用于我公司的主页.
I am trying to show and hide the tables based on when a user clicks tab 1 or tab 2. I am stuck at the moment and could use some help.I have tried jquery and the ajax control toolkit neither of which work for the master page of my company.
<div class="divAreaTabs" runat="server" id="tabs">
<ul>
<li id="tab1" class="activeTab"><a href="#">Tab 1</a></li>
<li id="tab2"><a href="#">Tab 2</a></li>
<div style="clear: both;"></div>
</ul>
<div class="divAreaTabsContent">
<table width="600" height="400" cellpadding=0 cellspacing=0 runat="server" id="XP">
<tr valign="top">
<td class="TabArea" style="width: 600px">
<br />
<br />
TAB VIEW 1
INSERT YOUR CONENT IN HERE
CHANGE SELECTED IMAGE URL AS NECESSARY
</td>
</tr>
<table width="600" height="400" cellpadding=0 cellspacing=0 runat="server" id="win7">
<tr valign="top">
<td class="TabArea" style="width: 600px">
<br />
<br />
TAB VIEW 2
INSERT YOUR CONENT IN HERE
CHANGE SELECTED IMAGE URL AS NECESSARY
</td>
</tr>
</div>
推荐答案
最后一个示例将起作用.
此处是一个新的演示，用于响应仅一个请求的请求div随时显示.
The last example will work.
Here is a new demo in response to a request where only one div is displayed at any one time.
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<script language="javascript" type="text/javascript">
function ShowHide(i) {
document.getElementById('divtab2').style.visibility = 'hidden';
if (i==1)
{
document.getElementById('divtab2').style.visibility = 'hidden';
document.getElementById('divtab1').style.visibility = 'visible';
}
if (i==2){
document.getElementById('divtab1').style.visibility = 'hidden';
document.getElementById('divtab2').style.visibility = 'visible';
}
}
</script>
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div class="divAreaTabs" runat="server" id="tabs">
<ul>
<li id="tab1" class="activeTab" onclick="ShowHide('1');"><a href="#">Tab 1</a></li>
<li id="tab2" onclick="ShowHide('2');"><a href="#">Tab 2</a></li>
<div style="clear: both;"></div>
</ul>
<div class="divAreaTabsContent">
<div id="divtab1" onclick="ShowHide('1');">
<table width="600" height="400" cellpadding=0 cellspacing=0 runat="server" id="XP">
<tr valign="top">
<td class="TabArea" style="width: 600px">
<br />
<br />
TAB VIEW 1
INSERT YOUR CONENT IN HERE
CHANGE SELECTED IMAGE URL AS NECESSARY
</td>
</tr>
</table>
</div>
<div id="divtab2">
<table width="600" height="400" cellpadding=0 cellspacing=0 runat="server" id="win7">
<tr valign="top">
<td class="TabArea" style="width: 600px">
<br />
<br />
TAB VIEW 2
INSERT YOUR CONENT IN HERE
CHANGE SELECTED IMAGE URL AS NECESSARY
</td>
</tr>
</table>
</div>
</div>
<script language="javascript" type="text/javascript">
ShowHide();
</script>
</div>
</form>
</body>
</html>
将它们放在单独的面板中，然后在此处设置ID，然后使用它们设置visible = false;可见=必要时为true.
Put them is seperate panels, then set there ID''s and then use them to set visible = false; and visible = true as required.
这篇关于隐藏带有div的显示表的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
