首页 > 代码库 > table选项卡
table选项卡
根据页面条件自己设置选项卡:
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选项卡