码迷,mamicode.com
首页 > 其他好文 > 详细

通用选项卡效果

时间:2017-04-10 13:43:55      阅读:170      评论:0      收藏:0      [点我收藏+]

标签:选项卡   通用   

<script>
function changeTab(changetab){
	var tabs=$(".navtab_sml").find("a");
	var cts=$(".navtab_sml_info > div");
    for(i=0;i<tabs.length;i++){
		if(tabs[i]==changetab){
			tabs[i].className="selected";
			cts[i].style.display="block";
		}else{
		   tabs[i].className="";
		   cts[i].style.display="none"; 	
		}
	}
}
</script>
<div class="navtab_sml clearfix">
        <a class="selected" onClick="changeTab(this)">基本信息</a>
        <a onClick="changeTab(this)">资质审查</a>
        <a onClick="changeTab(this)">入场人员信息</a>
        <a onClick="changeTab(this)">入场人员管理-附件</a>
        <a onClick="changeTab(this)">入场人员管理-培训</a>
        <a onClick="changeTab(this)">入场条件审查</a>
        <a onClick="changeTab(this)">施工机具资料</a>
</div>
 <div class="navtab_sml_info">
      <div>基本信息内容</div>
      <div>资质审查内容</div>
      <div>入场人员信息内容</div>
      <div>入场人员管理-附件内容</div>
      <div>入场人员管理-培训内容</div>
      <div>入场条件审查内容</div>
      <div>施工机具资料内容</div>
 </div>



本文出自 “雨若曦” 博客,请务必保留此出处http://1940817891.blog.51cto.com/9833202/1914470

通用选项卡效果

标签:选项卡   通用   

原文地址:http://1940817891.blog.51cto.com/9833202/1914470

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!