javascript tab onclick
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
<title>my_tab</title>
<META
http-equiv=Content-Type content="text/html;
charset=utf-8">
<style>
ul, li{list-style:none;}
#tab ul
li{float:left;width:40px;}
.clearBoth{clear:both;}
.ok{display:none;}
.dis{display:block;}
</style>
<body>
<div
id="tab">
<ul>
<li><a onClick="selectTag(‘tagContent0‘, this)"
href="javascript:void(0)">1111</a></li>
<li><a onClick="selectTag(‘tagContent1‘,
this)" href="javascript:void(0)">222</a></li>
<li><a onClick="selectTag(‘tagContent2‘,
this)" href="javascript:void(0)">333</a></li>
</ul>
<br class="clearBoth"
/>
<div id="tagContent0" class="ok
dis">
xxxxx
</div>
<div id="tagContent1"
class="ok">
yyyyyyyyyyy
</div>
<div id="tagContent2"
class="ok">
zzzzz
</div>
</div>
<script>
function
selectTag(showContent, selfObj)
{
var tag =
document.getElementById("tab").getElementsByTagName("li");
var tagLength = tag.length;
for(i=0; i<tagLength;
i++)
{
tag[i].className = "";
}
selfObj.parentNode.className = "selectTag";
for(i=0; j=document.getElementById("tagContent"+i); i++)
{
if(i >= tagLength)
break;
j.style.display =
"none";
}
document.getElementById(showContent).style.display="block";
}
</script>
</body>
</html>
郑重声明：本站内容如果来自互联网及其他传播媒体，其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。
