Recently more leisurely, I made a JavaScript nodetree, online similar things in fact quite a lot of functions than this whole, I do this purely to practice practicing.
Icons can be customized (16X16), and menu items are entirely JSON-type-defined for easy modification.
Interface：
How to use：
1, copy the Nodetree-json.js and CSS folders into the project and reference.
2. Refer to the jquery framework.
3, modify the Nodetree-json.js in the Nodetreemenu menu items, the following is a simple description.
Copy Code code as follows:
var nodetreemenu = [
ID: node Id,pid: parent Node ID, no parent node is 0,name: Display Name, img: Display icon, open: Only the parent node has this property, the child node is expanded by default, file: Only child nodes by this property, click on the Open page
{id:1, pid:0, Name: "Parent node One", img: "Css/images/001.png", open:true},
{id:101, pid:1, Name: "Child node One", img: "Css/images/002.png", File: "http://www.cnblogs.com/nnzfly/"}//note that the end of the last row of data must not add commas! Otherwise IE under the error!
]
4, add the following code where you want to display Nodetree:
Copy Code code as follows:
<ul id= "Nodetree-json" >
</ul>
5. Add the following code to the page:
Copy Code code as follows:
<script type= "Text/javascript" >
$ (function () {
Nodetree ("MainFrame");
});
</script> or (whichever is optional):
<script type= "Text/javascript" >
Window.onload=function () {
Nodetree ("MainFrame");
}
</script>
Nodetree ("MainFrame"), MainFrame is the name of the target frame, such as the navigation bar in the left frame, and the Name= "MainFrame" of the frame displayed on the right.
Really do not understand look at the demo.htm code, you understand.
Attached source code, interested can see ~
Http://dl.vmall.com/c0b7wda1ps
Please click on the recommendation, your support is my greatest motivation!
