一个精简的JS DIV层tab切换代码
作者:bea
<title>DIV层切换</title> <script language="JavaScript" type="text/javascript"> function ChangeDiv(divId,divName,zDivCount) { for(i=0;i<=zDivCount;i++) { document.getElementById(divName+i).style.display="none"; //将所有的层都隐藏
<title>DIV层切换</title>
<script language="JavaScript" type="text/javascript">
function ChangeDiv(divId,divName,zDivCount)
{
for(i=0;i<=zDivCount;i++)
{
document.getElementById(divName+i).style.display="none";
//将所有的层都隐藏
}
document.getElementById(divName+divId).style.display="block";
//显示当前层
}
</script>
</head>
<body>
<span onclick="JavaScript:ChangeDiv('0','JKDiv_',2)" style="cursor:hand;">内容一</span>
<span onclick="JavaScript:ChangeDiv('1','JKDiv_',2)" style="cursor:hand;">内容二</span>
<span onclick="JavaScript:ChangeDiv('2','JKDiv_',2)" style="cursor:hand;">内容三</span>
<div id="JKDiv_0" style="font-size:14px;margin:20px;color:#FF0000;">内容部分第一区</div>
<div id="JKDiv_1" style="display:none;font-size:14px;margin:10px;color:#FF0000;">内容部分第二区</div>
<div id="JKDiv_2" style="display:none;font-size:14px;margin:10px;color:#FF0000;">内容部分第三区</div>
</body>
[Ctrl+A 全选 注:
如需引入外部Js需刷新才能执行]
有用 | 无用
猜你喜欢
您可能感兴趣的文章:
- 分享十五个最佳jQuery 幻灯插件和教程
- Jquery 1.42 checkbox 全选和反选代码
- 网络图片延迟加载实现代码 超越jquery控件
- JQuery的一些小应用收集
- Visual Studio中的jQuery智能提示设置方法
- Jquery 滑入滑出效果实现代码
- Jquery ajax不能解析json对象,报Invalid JSON错误的原因和解决方法
- javascript sudoku 数独智力游戏生成代码
- Javascript 函数中的参数使用分析
- js几个验证函数代码
- js 图片上传前大小长宽验证代码
- Firefox下提示illegal character并出现乱码的原因
- JavaScript setTimeout和setInterval的使用方法 说明
- JavaScript 学习初步 入门教程
- ext 列表页面关于多行查询的办法
- JS学习之一个简易的日历控件
- javascript instanceof,typeof的区别
- ExtJs使用IFrame的实现代码
- JS 显示当前日期与时间的代码