table选项卡

标签：style   io   ar   for   div   sp   cti   on   c   

根据页面条件自己设置选项卡：

table：

<ul class="mul">
<li><a id="current1" style="cursor: pointer;" class="cur" onclick="changeTab(‘current‘,1,4);">
<span id="tab01">基本信息</span></a> </li>
<li><a id="current2" style="cursor: pointer;" onclick="changeTab(‘current‘,2,4);">
<span id="tab02">详细介绍</span></a> </li>
<li><a id="current3" style="cursor: pointer;" onclick="changeTab(‘current‘,3,4);">
<span id="tab03">商品属性</span></a> </li>
<li><a id="current4" style="cursor: pointer;" onclick="changeTab(‘current‘,4,4);">
<span id="tab04">商品多图</span></a> </li>

</ul>

<div id="content1" style="display: none;">基本信息</div>

<div id="content2" style="display: none;">详细介绍</div>

<div id="content3" style="display: none;">商品属性</div>

<div id="content4" style="display: none;">商品多图</div>

js控制：

function changeTab(name, cursel, index) {
for (i = 1; i <= index; i++) {

var menu = document.getElementById(name + i);

var contentcon = document.getElementById(‘content‘ + i);
menu.className = i == cursel ? "hover" : "";
contentcon.style.display = i == cursel ? "block" : "none";
}
}

table选项卡

标签：style   io   ar   for   div   sp   cti   on   c   

原文地址：http://www.cnblogs.com/JeffConrtoller/p/3973505.html