生成树形菜单
页面根据数据库表的内容动态生成树形菜单,数据库表有父类ID字段,点击某一节点显示该节点的下一级节点列表,并可以进行增删查改操作
[解决办法]
http://dhtmlx.com/docs/products/dhtmlxTree/,楼主你看看这是dhtmstree。我们就是用的是这个,还可以完成拖拽等功能,还能调换风格(比如蓝色、黄色)等。开发包的例子特别多,你基本上改一改就能用。你要做的事情就是写个递归拼接XML.这个也不难,建议楼主用这个。
[解决办法]
个人推荐jQuery插件zTree,可以参考:http://www.baby666.cn/v3/demo.php#_305,当光标移到菜单项上时可以进行增加,编辑,删除操作,当然其它基本的操作肯定是有的啦
[解决办法]
你是说类似csdn论坛的树形分类么??
<html> <head> <script> function getChild(imageObject) { var tableTree = document.getElementById("tableTree"); var currentRow = imageObject.parentNode.parentNode; var imageCount = currentRow.getElementsByTagName("img").length; var currentRowIndex = 0; for(currentRowIndex = 0;currentRowIndex < tableTree.rows.length;currentRowIndex++) { if(tableTree.rows[currentRowIndex] == currentRow) { break; } } if(imageObject.src.indexOf("_plus1.gif") != -1) { imageObject.src = imageObject.src.replace("http://community.csdn.net/ui/scripts/System/_resource/MzTreeView/_plus1.gif","http://community.csdn.net/ui/scripts/System/_resource/MzTreeView/_minus1.gif"); var newTr = tableTree.insertRow(currentRowIndex+1); var newTd = newTr.insertCell(0); var imageStr = ""; for(var i = 0;i < imageCount;i++) { imageStr += "<img src='http://community.csdn.net/ui/scripts/System/_resource/MzTreeView/_line4.gif'/>"; } newTd.innerHTML = imageStr + "<img onclick='getChild(this)' src='http://community.csdn.net/ui/scripts/System/_resource/MzTreeView/_plus1.gif'/>子节点"; } else { imageObject.src = imageObject.src.replace("http://community.csdn.net/ui/scripts/System/_resource/MzTreeView/_minus1.gif","http://community.csdn.net/ui/scripts/System/_resource/MzTreeView/_plus1.gif"); for(var i = currentRowIndex+1;i < tableTree.rows.length;i++) { if(tableTree.rows[i].getElementsByTagName("img").length > currentRow.getElementsByTagName("img").length) { tableTree.deleteRow(i); --i; } else { break; } } } } </script> </head> <body> <table id="tableTree" style="border:1px solid gray;border-collapse:collapse;width:100%;" cellpadding="0" cellspacing="0"> <tr> <td><img onclick="getChild(this)" src="http://community.csdn.net/ui/scripts/System/_resource/MzTreeView/_plus1.gif"/>顶级节点</td> </tr> <tr> <td><img onclick="getChild(this)" src="http://community.csdn.net/ui/scripts/System/_resource/MzTreeView/_plus1.gif"/>顶级节点</td> </tr> <tr> <td><img onclick="getChild(this)" src="http://community.csdn.net/ui/scripts/System/_resource/MzTreeView/_plus1.gif"/>顶级节点</td> </tr> </table> </body></html>