简单的树形菜单
<!--- 简单的树形菜单 徐祖宁(唠叨) 2003.03 czjsz_ah@stats.gov.cn 树形菜单较滑动菜单稍微复杂一点。其主要难点在于从简洁的数据描述来产生便于操纵的html结构。 本例用来展示树形菜单的编写。使用无线表格,算法上采用了递归,理论上可构造无穷分制枝的树。 本代码可自由扩散。 ---> <style> table {font-size = 9pt} td {height = 10px} </style> <body> <span id="menus"></span> <span id="view"></span> </body> <script> /** * 构造树,初值为0 */ function tree(n) { var id = new Array("bar","pad","#","+"); if(n == 0) { // 初始化变量 n = 1; i = 0; s = ""; } s += "<table>"; for(;i<tree_ar.length-1;i++) { var k = (n >= tree_ar[i+1][0])?0:1; s += "<tr id=''"+id[k]+"'' value="+i+"><td>"+id[k+2]+"</td><td>"+tree_ar[i][1]+"</td></tr>"; // 构造节点,注意这里的自定义属性value。作用是简化构造节点的描述,共享参数数组信息。 if(n > tree_ar[i+1][0]) { // 若期望层次大于当前层次,结束本层次返回上一层次。 s += "</td></tr></table>"; return tree_ar[i+1][0]; } if(n < tree_ar[i+1][0]) { // 若期望层次小于当前层次,递归进入下一层次。 s += "<tr style=''display:none'' v=1><td></td><td>"; var |
查看所有评论
