tab切换js代码 笨拙却简单实用

2016-01-18 948 0

JS结合DIV做tab切换效果,网上的代码很多,其原理是点击某个链接就把某个<div>样式的显示属性设置为显示,将其它的与tab相关的<div>设置为隐藏。如果这样的div比较多的时候,js里面就会写很多的东西。

以下是最简单也最笨的tab切换js代码,不繁琐。有一个循环就可以解决。tab切换js代码如下:

function Show_TabADSMenu(tabadid_num,tabadnum){

for(var i=1;i<=2;i++){
document.getElementById(“tabadcontent_”+tabadid_num+i).style.display=”none”;

}
document.getElementById(“tabadcontent_”+tabadid_num+tabadnum).style.display=”block”;

}

这样就不用在函数体内把每个div都写一遍,只需要传参数进来就好。

<div id=”tabadcontent_11″>内容</div>

<div style=”display:none;” id=”tabadcontent_12″>内容</div>

事件:

<h2 onclick=”return Show_TabADSMenu(1,1)”>登 陆</h2>

<h3 onclick=”return Show_TabADSMenu(1,2)”>免费试用</h3>

相关文章

必应站长平台提示网站SEO description文字偏短,及WORDPRESS内容批量替换保险做法
wordpress6.5升级至6.8有风险!不得不采取曲线救国方式来解决
国际择校信息平台开发手记:5+2=23,均瑶集团下属的“世外教育系国际学校”,在上海究竟有多少所?
迅睿CMS后台内容加载不出来,解决方式是升级至最新框架及建站系统,附离线包升级实操记录
择校信息平台开发手记:2025中国国际化学校排名100强,有两家比均瑶集团旗下上海世外学校更强?
超好用!营销人木木老贼推荐“智谱清言 ”8个人工智能体AI工具

发布评论