js选项卡的问题 解决一个页面不能用两个选项卡
//JS代码:
function tabOn(tabid,a) {
for (i=1;i<=10;i++) {
if(i<10){inn="0"+i;} else {inn=""+i;}
tabMenu = document.getElementById("tab"+tabid+"m"+i);
tabContent = document.getElementById("tab"+tabid+"c"+i);
tabMore = document.getElementById("tab"+tabid+"more"+i);
if (tabMenu) {
if (tabMenu.tagName=="IMG") { tabMenu.src = tabMenu.src.replace("on.gif", ".gif"); }
if (tabMenu.tagName=="A") { tabMenu.className=""; }
}
if (tabContent) { tabContent.style.display="none"; }
if (tabMore) { tabMore.style.display="none"; }
}
if(a<10){ann="0"+a;} else {ann=""+a;}
tabMenu = document.getElementById("tab"+tabid+"m"+a);
tabContent = document.getElementById("tab"+tabid+"c"+a);
tabMore = document.getElementById("tab"+tabid+"more"+a);
//alert(tabMenu.tagName);
if (tabMenu) {
if (tabMenu.tagName=="IMG") { tabMenu.src = tabMenu.src.replace(".gif", "on.gif"); }
if (tabMenu.tagName=="A") { tabMenu.className="on"; }
}
if (tabContent) { tabContent.style.display="block"; }
if (tabMore) { tabMore.style.display="block"; }
}
function imgMenuOver(containderID) {
var objwrap = document.getElementById(containderID);
var imgMenu = objwrap.getElementsByTagName("a");
for (i=0; i<imgMenu.length; i++) {
if(imgMenu[i].getElementsByTagName("img").length == 0) continue;
if (imgMenu[i].getElementsByTagName("img")[0].src.indexOf("_on.gif") != -1 ) {
continue;
}
imgMenu[i].onmouseover = function() {
subImage = this.getElementsByTagName("img")[0];
if (subImage.src.indexOf("_on.gif") != -1) return false;
subImage.src = subImage.src.replace("_off.gif","_on.gif");
}
imgMenu[i].onfocus = function() {
subImage = this.getElementsByTagName("img")[0];
if (subImage.src.indexOf("_on.gif") != -1) return false;
subImage.src = subImage.src.replace("_off.gif","_on.gif");
}
imgMenu[i].onmouseout = function() {
subImage = this.getElementsByTagName("img")[0];
subImage.src = subImage.src.replace("_on.gif", "_off.gif");
}
imgMenu[i].onblur = function() {
subImage = this.getElementsByTagName("img")[0];
subImage.src = subImage.src.replace("_on.gif", "_off.gif");
}
}
}
HTML代码:
<div id="board" class="clearfix">
<h2><img src="images/notice_title.gif" width="48" height="13" alt="????" /></h2>
<ul class="clearfix">
<li class="first">
<a href="#tab1c1" onclick="tabOn(1,1); return false;" onmouseover="tabOn(1,1); return false;">
<img src="images/tab1m01on.gif" height="23" alt="??" id="tab1m1" />
</a>
<div id="tab1c1" class="tabcontent">
<ul>
<li>
<a href="#">
[??]
MOS Master 1,2 ???..
</a>
<span>2012-04-11</span>
</li>
</ul>
</div>
<div id="tab1more1" class="tab1more">
<a href="#1"><img src="images/board_more.gif" width="31" height="11" alt="查看更多" /></a>
</div>
</li>
<li>
<a href="#tab1c2" onclick="tabOn(1,2); return false;" onmouseover="tabOn(1,2); return false;">
<img src="images/tab1m02.gif" height="23" alt="??" id="tab1m2" />
</a>
<div id="tab1c2" class="tabcontent">
<ul>
<li>
<a href="/boardView.do?bcode=B0062&id=87479&pid=500">
? ?? ???? ???(??) ?? ?..
</a>
<span>2012-04-10</span>
</li>
</ul>
</div>
<div id="tab1more2" class="tab1more">
<a href="/boardList.do?bcode=B0062"><img src="images/board_more.gif" width="31" height="11" alt="查看更多" /></a>
</div>
</li>
<li>
<a href="#tab1c3" onclick="tabOn(1,3); return false;" onmouseover="tabOn(1,3); return false;">
<img src="images/tab1m03.gif"height="23" alt="??" id="tab1m3" />
</a>
<div id="tab1c3" class="tabcontent">
<ul>
<li>
<a href="/boardView.do?bcode=B0026&id=75579&pid=988">
????? ?????????- ??? ?..
</a>
<span>2011-08-16</span>
</li>
</ul>
</div>
<div id="tab1more3" class="tab1more">
<a href="/boardList.do?bcode=B0026"><img src="images/board_more.gif" width="31" height="11" alt="查看更多" /></a>
</div>
</li>
<li>
<a href="#tab1c4" onclick="tabOn(1,4); return false;" onmouseover="tabOn(1,4); return false;">
<img src="images/tab1m04.gif"height="23" alt="??·??" id="tab1m4" />
</a>
<div id="tab1c4" class="tabcontent">
<ul>
<li>
<a href="/boardView.do?bcode=B0114&id=85237&pid=22">
[??]
2012?? 1?? ?? ????..
</a>
<span>2012-03-23</span>
</li>
</ul>
</div>
<div id="tab1more4" class="tab1more">
<a href="/boardList.do?bcode=B0114"><img src="images/board_more.gif" width="31" height="11" alt="查看更多" /></a>
</div>
</li>
</ul>
<script type="text/javascript"> tabOn(1,1); </script>
<!-- //board -->
</div>
我复制一份HTMl到另一个地方后 新的就不能切换了
------解决方案--------------------
这代码看得人那叫一个蛋疼
[解决办法]
- JScript code
function tabOn(tabid,a) {for (i=1;i<=10;i++) {if(i<10){inn="0"+i;} else {inn=""+i;}tabMenu = document.getElementById("tab"+tabid+"m"+i);tabContent = document.getElementById("tab"+tabid+"c"+i);tabMore = document.getElementById("tab"+tabid+"more"+i);if (tabMenu) {if (tabMenu.tagName=="IMG") { tabMenu.src = tabMenu.src.replace("on.gif", ".gif"); } if (tabMenu.tagName=="A") { tabMenu.className=""; } }if (tabContent) { tabContent.style.display="none"; }if (tabMore) { tabMore.style.display="none"; }}if(a<10){ann="0"+a;} else {ann=""+a;}tabMenu = document.getElementById("tab"+tabid+"m"+a);tabContent = document.getElementById("tab"+tabid+"c"+a);tabMore = document.getElementById("tab"+tabid+"more"+a);// alert(tabMenu.tagName);if (tabMenu) {if (tabMenu.tagName=="IMG") { tabMenu.src = tabMenu.src.replace(".gif", "on.gif"); } if (tabMenu.tagName=="A") { tabMenu.className="on"; } }if (tabContent) { tabContent.style.display="block"; }if (tabMore) { tabMore.style.display="block"; }}function imgMenuOver(containderID) {var objwrap = document.getElementById(containderID);var imgMenu = objwrap.getElementsByTagName("a");for (i=0; i<imgMenu.length; i++) {if(imgMenu[i].getElementsByTagName("img").length == 0) continue;if (imgMenu[i].getElementsByTagName("img")[0].src.indexOf("_on.gif") != -1 ) {continue;}imgMenu[i].onmouseover = function() {subImage = this.getElementsByTagName("img")[0];if (subImage.src.indexOf("_on.gif") != -1) return false;subImage.src = subImage.src.replace("_off.gif","_on.gif");}imgMenu[i].onfocus = function() {subImage = this.getElementsByTagName("img")[0];if (subImage.src.indexOf("_on.gif") != -1) return false;subImage.src = subImage.src.replace("_off.gif","_on.gif");}imgMenu[i].onmouseout = function() {subImage = this.getElementsByTagName("img")[0];subImage.src = subImage.src.replace("_on.gif", "_off.gif");}imgMenu[i].onblur = function() {subImage = this.getElementsByTagName("img")[0];subImage.src = subImage.src.replace("_on.gif", "_off.gif");}}}