I wanted to get a JS menu last night, and I didn't get it out all night. Later, Baidu, a little Khan ~ ~ ~
The effect of the implementation is very simple, is to click on the display, and then click on the hidden, but is more than a few levels of the problem. OK, now to say my idea of design, start with the first level, add the following code:
<div><a onclick= "News_pro (' 1.1 ')" >1</a></div>
<div id= "1.1" >
<div> <a onclick= "News_pro (' 1.1.1 ')" >1.1</a></div>
</div>
This appears two times category, point parent display (hidden) child menu, JS code is a word:
function News_pro (o)
{
var Obj=document.getelementbyid (o)
obj.style.display== ""? Obj.style.display= "None": obj.style.display= "";
}
Isn't it a little too easy, yes, it's that simple, but it's not over yet, we're going to go ahead and add levels three and four submenus:
<div><a onclick= "News_pro (' 1.1 ')" >1</a></div>
<div id= "1.1" >
<div> <a onclick= "News_pro (' 1.1.1 ')" >1.1</a></div>
<div id= "1.1.1" >
<div> <a onclick= "News_pro (' 1.1.1.1 ')" >1.1.1</a></div>
<div id= "1.1.1.1" >
<div> 1.1.1.1</div>
<div> 1.1.1.2</div>
</div>
<div> 1.1.2</div>
</div>
<div> 1.2</div>
<div> 1.3</div>
</div>
JS code or only that line, so easy, but really so finished it? The answer is nonono!. When you point to one of the level, the page jumps, this is what we want, but the left menu has become the original look, and did not save the state I just clicked, that how to do? Because colleagues are going to use the ASP, as if there is no view state this dongdong, that use session to save it? It seems to work. But if you click a bit faster, you will find that the menu sometimes a few times will be different, the basic reaction or session lost, and finally I found my name is very interesting, Level 1, two is 1.1 three level is 1.1.1, four is 1.1.1.1, think of what? Thought of the database design multi-level categories of query it!? It seems that the category in Discuz is designed like this. It query also quickly, then I also give it a quick, brainwave, so happy.
The code is as follows, using the URL to pass the value of the way:
<div><a onclick= "News_pro (' 1.1 ')" href= "id=1.1" >1</A></DIV>
<div id= "1.1" <%I F InStr (Request.QueryString ("id"), "1.1") =0 Then Response.Write style= ' Display:none; ' %>>
<div> <a onclick= "News_pro (' 1.1.1 ')" href= "id=1.1.1" >1.1</A></DIV>
< Div id= "1.1.1" style= "Display:none" <%if InStr (Request.QueryString ("id"), "1.1.1") =0 Then Response.Write style= ' Display:none; ' %>>
<div> <a onclick= "News_pro (' 1.1.1.1 ')" href= "id=1.1.1.1" >1.1.1</a></div>
<div id= "1.1.1.1" <%if InStr (Request.QueryString ("id"), "1.1.1.1" =0 Then ' Response.Write ' Display: none; ' %>>
<div> 1.1.1.1</div>
<div> 1.1.1.2</div>
</div>
<div> 1. 1.2</div>
</div>
<div> 1.2</div>
<div> 1.3</div>
</div>
<div><a >2</a></div>
<div><a >3</a></Div>
I believe this code does not manage ASP or asp.net are not very different, in fact, with pure JS can be done, but since it is used in the ASP, why do you want to write more JS? Well, the function has been realized. Everyone is OK, if you have a different method, welcome to post it all together to share. From the study of progress ...