Javascript controls dd hiding and display

A friend asked me to use js to process the display and hiding of the menu on the left. Although the examples in this field are compared on the Internet, this may be a bit unique and special record.

 

Author: Li chengxiang

 

<Div class = "containerleft"> <br/> <DL> <br/> <DT id = "dt1"> <a href = "#" mce_href = "#" onclick = "showmenu (this, 1) "> <SPAN class =" icon product "> product management </span> </a> </DT> <br/> <DD> <br/> <a href = "category_list.aspx" mce_href = "category_list.aspx"> <SPAN class = "item"> category list </span> </a> </DD> <br/> <DD> <br /> <a href = "category_add.aspx" mce_href = "category_add.aspx"> <SPAN class = "item"> Add Category </span> </a> </DD> <br/> <DD> <br /> <A href = "product_list.aspx" mce_href = "product_list.aspx"> <SPAN class = "item"> product list </span> </a> </DD> <br/> <DD> <br/> <a href = "product_add.aspx" mce_href = "product_add.aspx"> <SPAN class = "item"> Add product </span> </a> </DD> <br/> <DT id = "dt2"> <a href = "#" mce_href = "#" onclick = "showmenu (this, 2) "> <SPAN class =" icon product "> vehicle model management </span> </a> </DT> <br/> <DD> <br/> <a href = "chexinglist. aspx "mce_href =" chexinglist. as Px "> <SPAN class =" item "> vehicle model list </span> </a> <br/> </DD> <br/> <DD> <br/> <a href = "chexingadd. aspx "mce_href =" chexingadd. aspx "> <SPAN class =" item "> Add models </span> </a> <br/> </DD> <br/> <DT id =" dt3"> <a href = "#" mce_href = "#" onclick = "showmenu (this, 3) "> <SPAN class =" icon product "> brand management </span> </a> </DT> <br/> <DD> <br/> <a href = "brandlist. aspx "mce_href =" brandlist. aspx "> <SPAN class =" item "> brand list </span> </a> </DD> <br /> <DD> <br/> <a href = "brand. aspx "mce_href =" brand. aspx "> <SPAN class =" item "> Add a brand </span> </a> </DD> <br/> <DT id =" dt4 "> <a href = "#" mce_href = "#" onclick = "showmenu (this, 4) "> <SPAN class =" icon product "> redemption management </span> </a> </DT> <br/> <DD> <br/> <a href = "prochange. aspx "mce_href =" prochange. aspx "> <SPAN class =" item "> product exchange </span> </a> </DD> <br/> <a href = "prochange. aspx "mce_href =" prochange. aspx "> <SPA N class = "item"> Add a redemption product </span> </a> </DD> <br/> <DT id = "dt5"> <a href = "# "mce_href =" # "onclick =" showmenu (this, 5) "> <SPAN class =" icon ERP "> News management </span> </a> </DT> <br/> <DD> <br/> <a href = "news_list.aspx" mce_href = "news_list.aspx"> <SPAN class = "item"> News list </span> </a> </DD> <br/> <DD> <br /> <a href = "newsadd. aspx "mce_href =" newsadd. aspx "> <SPAN class =" item "> Add news </span> </a> </DD> <br/> <DT id =" dt6 "> <a href = "#" MCE _ Href = "#" onclick = "showmenu (this, 6) "> <SPAN class =" icon ERP "> help management </span> </a> </DT> <br/> <DD> <br/> <a href = "helpcol. aspx "mce_href =" helpcol. aspx "> <SPAN class =" item "> help column </span> </a> </DD> <br/> <a href = "helpcoladd. aspx "mce_href =" helpcoladd. aspx "> <SPAN class =" item "> Add a help column </span> </a> </DD> <br/> <a href = "helps_list.aspx" mce_href = "helps_list.aspx"> <SPAN class = "item"> help management </span> </a> </DD> <br/> <a href = "helpsadd. aspx "mce_href =" helpsadd. aspx "> <SPAN class =" item "> Add help </span> </a> </DD> <br/> <DT id =" dt7 "> <a href = "#" mce_href = "#" onclick = "showmenu (this, 7) "> <SPAN class =" icon ERP "> Links </span> </a> </DT> <br/> <DD> <br/> <a href = "linkslist. aspx "mce_href =" linkslist. aspx "> <SPAN class =" item "> Links </span> </a> </DD> <br/> <a href = "linksadd. aspx "mce_href =" linksadd. aspx"> <SPAN class = "item"> Add link </span> </a> </DD> <br/> <DT id = "dt8"> <a href = "#" mce_href = "#" onclick = "showmenu (this, 8) "> <SPAN class =" icon ERP "> intra-site link </span> </a> </DT> <br/> <DD> <br/> <a href = "weblinklist. aspx "mce_href =" weblinklist. aspx "> <SPAN class =" item "> intra-site link </span> </a> </DD> <br/> <a href = "weblinkadd. aspx "mce_href =" weblinkadd. aspx "> <SPAN class =" item "> Add a site link </span> </a> </DD> <br/> </dl> <br/> <Div class = "lineheight"> <br/> </div> </P> <p> <MCE: script Type = "text/JavaScript"> <! -- <Br/> var dtid = 0; // record the currently displayed ID <br/> function showmenu (O, ID) {<br/> var OBJ = O. parentnode; <br/> var onode = obj. nextsibling; <br/> If (parseint (dtid)> 0) {<br/> hidemenu (dtid, 'None '); <br/>}< br/> If (dtid = ID) dtid = 0; <br/> else {<br/> hidemenu (ID ); <br/> dtid = ID; <br/>}</P> <p> function hidemenu (ID, none) {<br/> var o = document. getelementbyid ("DT" + id); <br/> var J = 0; // defense Stop endless loop <br/> var onode = O. nextsibling; <br/> while (onode! = NULL & onode. tagname! = "DT" & J <8) {<br/> If (onode. tagname = "DD") {<br/> If (None = NULL) onode. style. display = ""; <br/> else onode. style. display = none; <br/>}< br/> J ++; <br/> onode = onode. nextsibling; <br/>}</P> <p> function menuiload () {<br/> for (VAR I = 1; I <9; I ++) <br/> hidemenu (I, 'None'); <br/>}</P> <p> setTimeout (menuiload, 1000) </P> <p> // --> </MCE: SCRIPT>