请教!跪求!div切换问题？

Question

有两个index_border怎么悬浮到第一个的显示正常，悬浮到第二个index_border的时候第一个切换而不是第二个呢？
<div class="index_border">
<script>
           function setTab(name,cursel,n){
    for(i=1;i<=n;i++){
    var menu=document.getElementById(name+i);
    var con=document.getElementById("con_"+name+"_"+i);
    if(menu == null || con == null)continue;
    menu.className=i==cursel?"hover":"";
    con.style.display=i==cursel?"block":"none";
    }
    }
     </script>
    <div id="Tab1">
        <div class="Menubox" style="background-color:#5B5B5B;">
            <ul>
             <li id="one1" onMouseOver="setTab('one',1,2)"  class="hover"><a href="bieshu.asp"><font size="-1"  style="font-family:'幼圆'; font-weight:bold;color:#FFFFFF;">别墅装修</font></a></li>
             <li id="one2" onMouseOver="setTab('one',2,2)" ><a href="meirong.asp"><font size="-1" style="font-family:'幼圆';font-weight:bold; color:#FFFFFF;">美容院装修</font></a></li>
            </ul>
        </div>
        <div class="Contentbox">  
            <div id="con_one_1" class="hover">
            <ul class="tab_ul">
                      
            <li>            
            <a href="newsshow.asp?id=969" target="_blank">·
            郑州别墅装修美丽要加密
            </a>
<span>2011-6-10</span>            
            </li>
            </ul>
            </div>
            <div id="con_one_2" style="display:none">
            <ul class="tab_ul">
               <li>            
            <a href="newsshow.asp?id=976" target="_blank">·
            美容院设计细节
            </a>
<span>2011-6-13</span>            
            </li>
            
            <li>            
            <a href="newsshow.asp?id=972" target="_blank">·
            美容院设计的中国风
            </a>
<span>2011-6-11</span>            
            </li>
            
            </ul>
            </div>
        </div>
    </div>
    <div id="Tab2">
        <div class="Menubox" style="background-color:#5B5B5B;">
            <ul>
               <li id="two1" onMouseOver="setTab('two',1,4)"  class="hover"><a href="jiudian.asp"><font size="-1"  style="font-family:'幼圆'; font-weight:bold;color:#FFFFFF;">酒店装修</font></a></li>
               <li id="two2" onMouseOver="setTab('two',2,4)" ><a href="wangba.asp"><font size="-1"  style="font-family:'幼圆'; font-weight:bold;color:#FFFFFF;">网吧装修</font></a></li>
            </ul>
        </div>
        <div class="Contentbox">  
            <div id="con_two_1" class="hover">
            <ul class="tab_ul">
             
            
            <li>            
            <a href="newsshow.asp?id=974" target="_blank">·
            酒店设计的古朴美
            </a>
<span>2011-6-12</span>            
            </li>
                    
            </ul>
            </div>
            <div id="con_two_2" style="display:none">
            <ul class="tab_ul">
               <li>            
            <a href="newsshow.asp?id=983" target="_blank">·
            网吧装修要做到的
            </a>
<span>2011-6-20</span>            
            </li>
             
            </ul>
            </div>
        </div>
    </div>
    <div id="Tab3">
        <div class="Menubox" style="background-color:#5B5B5B;">
            <ul>
               <li id="three1" onMouseOver="setTab('three',1,4)"  class="hover"><a href="bangongshi.asp"><font size="-1"  style="font-family:'幼圆'; font-weight:bold;color:#FFFFFF;">办公室装修</font></a></li>
               <li id="three2" onMouseOver="setTab('three',2,4)" ><a href="xiuxian.asp"><font size="-1"  style="font-family:'幼圆'; font-weight:bold;color:#FFFFFF;">休闲会所装修</font></a></li>
            </ul>
        </div>
        <div class="Contentbox">  
            <div id="con_three_1" class="hover">
            <ul class="tab_ul">
            
            <li>            
            <a href="newsshow.asp?id=1010" target="_blank">·
            做好办公室设计这个前提
            </a>
<span>2011-7-5</span>            
            </li>
             </div>
            <div id="con_three_2" style="display:none">
            <ul class="tab_ul">
            
            <li>            
            <a href="newsshow.asp?id=982" target="_blank">·
            郑州酒吧装修其设计的重要性
            </a>
<span>2011-6-19</span>            
            </li>
                   
            </ul>
            </div>
        </div>
    </div>
    
</div>
    
</div><div class="index_border">
<script>
           function setTab(name,cursel,n){
    for(i=1;i<=n;i++){
    var menu=document.getElementById(name+i);
    var con=document.getElementById("con_"+name+"_"+i);
    if(menu == null || con == null)continue;
    menu.className=i==cursel?"hover":"";
    con.style.display=i==cursel?"block":"none";
    }
    }
   
    </script>
    <div id="Tab1">
        <div class="Menubox" style="background-color:#5B5B5B;">
            <ul>
             <li id="one1" onMouseOver="setTab('one',1,2)"  class="hover"><a href="bieshu.asp"><font size="-1"  style="font-family:'幼圆'; font-weight:bold;color:#FFFFFF;">别墅装修</font></a></li>
             <li id="one2" onMouseOver="setTab('one',2,2)" ><a href="meirong.asp"><font size="-1" style="font-family:'幼圆';font-weight:bold; color:#FFFFFF;">美容院装修</font></a></li>
            </ul>
        </div>
        <div class="Contentbox">  
            <div id="con_one_1" class="hover">
            <ul class="tab_ul">
               <li>            
            <a href="newsshow.asp?id=969" target="_blank">·
            郑州别墅装修美丽要加密
            </a>
<span>2011-6-10</span>            
            </li>
                 </ul>
            </div>
            <div id="con_one_2" style="display:none">
            <ul class="tab_ul">
            
          
                <li>            
            <a href="newsshow.asp?id=976" target="_blank">·
            美容院设计细节
            </a>
<span>2011-6-13</span>            
            </li>
             </ul>
            </div>
        </div>
    </div>
    
    
    <div id="Tab2">
        <div class="Menubox" style="background-color:#5B5B5B;">
            <ul>
               <li id="two1" onMouseOver="setTab('two',1,4)"  class="hover"><a href="jiudian.asp"><font size="-1"  style="font-family:'幼圆'; font-weight:bold;color:#FFFFFF;">酒店装修</font></a></li>
               <li id="two2" onMouseOver="setTab('two',2,4)" ><a href="wangba.asp"><font size="-1"  style="font-family:'幼圆'; font-weight:bold;color:#FFFFFF;">网吧装修</font></a></li>
            </ul>
        </div>
        <div class="Contentbox">  
            <div id="con_two_1" class="hover">
            <ul class="tab_ul">
                <li>            
            <a href="newsshow.asp?id=974" target="_blank">·
            酒店设计的古朴美
            </a>
<span>2011-6-12</span>            
            </li>
             </ul>
            </div>
            <div id="con_two_2" style="display:none">
            <ul class="tab_ul">
                  <li>            
            <a href="newsshow.asp?id=977" target="_blank">·
            网吧设计要有的元素
            </a>
<span>2011-6-14</span>            
            </li>
              </ul>
            </div>
        </div>
    </div>
    <div id="Tab3">
        <div class="Menubox" style="background-color:#5B5B5B;">
            <ul>
               <li id="three1" onMouseOver="setTab('three',1,4)"  class="hover"><a href="bangongshi.asp"><font size="-1"  style="font-family:'幼圆'; font-weight:bold;color:#FFFFFF;">办公室装修</font></a></li>
               <li id="three2" onMouseOver="setTab('three',2,4)" ><a href="xiuxian.asp"><font size="-1"  style="font-family:'幼圆'; font-weight:bold;color:#FFFFFF;">休闲会所装修</font></a></li>
            </ul>
        </div>
        <div class="Contentbox">  
            <div id="con_three_1" class="hover">
            <ul class="tab_ul">
               <li>            
            <a href="newsshow.asp?id=1004" target="_blank">·
            办公室装修要的感觉
            </a>
<span>2011-7-1</span>            
            </li>
            </ul>
            </div>
            <div id="con_three_2" style="display:none">
            <ul class="tab_ul">
                 <li>            
            <a href="newsshow.asp?id=982" target="_blank">·
            郑州酒吧装修其设计的重要性
            </a>
<span>2011-6-19</span>            
            </li>
                   
            </ul>
            </div>
        </div>
    </div>
    
</div>
    
</div>

Answer 1

//动态加载选项卡
function TabShow(c_className, n_className, itemPrefix, obj, index) {
    if (obj.className == c_className) return;
    var tabList = obj.parentNode.getElementsByTagName(obj.tagName);
    for (i = 0; i < tabList.length; i++) {
        if (i == index) {
            obj.className = c_className;
            document.getElementById(itemPrefix + i).style.display = 'block';
        } else {
            tabList[i].className = n_className;
            document.getElementById(itemPrefix + i).style.display = 'none';
        }
    }
}给你一段js自己琢磨琢磨  参数说明：
c_className：选中时的样式名称, 
n_className：未选中时的样式名称, 
itemPrefix：元素id前缀，如：有个div的id=show_1那么它的前缀就是show_ , 
obj:当前对象, 
index：索引值，即表示选中的是第几个选项卡。