dz论坛模板制作时DIY导致tab无法切换的解决方法

我们在进行dz模板制作时，使用DIY功能去调用论坛中的不同版块的数据，由于DIY会自动增加外面的层，有时会导致某些模板的tab切换功能失效，也有的只会显示不会消失的情况。这是由于JS无法找到相应的节点。
224159shchoiabcbbozuah
解决DZ模板制作时TAB切换功能失效的方法就是用自己的代码结合目标网站的样式来替换。
第一步:修改TAB切换按钮。使用以下html代码代替(文字可以自己替换):

1. <ul>
   
2. <li id="two1" onMouSEOver="setTab(1)" class="on1">幼教</li>
   
3. <li id="two2" onMouseOver="setTab(2)">小学</li>
   
4. <li id="two3" onMouseOver="setTab(3)">初中</li>
   
5. <li id="two4" onMouseOver="setTab(4)">高中</li>
   
6. <li id="two5" onMouseOver="setTab(5)">大学</li>
   
7. </ul>

复制代码

第二步:将以下的JS代码放在以上的HTML代码的下面。

1. <script language="javascript">
   
2. <!--
   
3. function setTab(su){
   
4. for(i=1;i<=5;i++){
   
5. var menu=document.getElementById('two'+i);
   
6. menu.className = i==su?"on1":""; //三维运算来判断当前I是不是与SU相等，然后取值
   
7. var con=document.getElementById("con_"+i);
   
8. con.style.display = i==su?"block":"none";
   
9. }
   
10. }
    
11. //-->
    
12. </script>

复制代码

第三步:将内容版块使用以下的DZ代码替换。并且id="con_1" 需要不断的增加。如id="con_2"，id="con_3"……

1. <dl id="con_1" style="display: block;">
   
2. [loop]
   
3. <div class="fl phshuzi">{currentorder}</div><div class="phsz_r"><a href="{url}" title="{title}" target="_blank">{title}</a></div>
   
4. [/loop]
   
5. </dl>

复制代码

第四步:由于不同网站所使用的类名不一样，以上的代码需要结合自己的网站的类名进行修改，以达到自己需要的效果。