jQuery-Easyui 1.2 实现多层菜单

需求:菜单比如“导航菜单-基础数据-基础数据1-子菜单1”

效果:

jQuery-Easyui 1.2 实现多层菜单_第1张图片


js代码如下

 1 /****************************************Index页面******************************************/
 2 
 3 var _menus = {
 4     basic: [{
 5         "menuid": "10",
 6         "icon": "icon-sys",
 7         "menuname": "常用菜单",
 8         "menus":
 9                  [{
10                      "menuid": "111",
11                      "menuname": "基础数据1",
12                      "icon": "icon-nav",
13                      "url": "#"
14                  }, {
15                      "menuid": "113",
16                      "menuname": "基础数据12",
17                      "icon": "icon-nav",
18                      "url": "#"
19                  },
20         //
21                   {
22                   "menuid": "119",
23                   "menuname": "这个是有子菜单的",
24                   "icon": "icon-nav",
25                   "menus": [{
26                       "menuid": "120",
27                       "menuname": "子菜单1",
28                       "icon": "icon-nav",
29                       "menus": [{
30                       "menuid": "120",
31                       "menuname": "子子菜单11111",
32                       "icon": "icon-nav",
33                       "url": "#"
34                       }]
35                       }]
36 
37                   },
38 
39         //
40                  {
41                  "menuid": "115",
42                  "menuname": "基础数据13",
43                  "icon": "icon-nav",
44                  "url": "#"
45              }, {
46                  "menuid": "117",
47                  "menuname": "基础数据14",
48                  "icon": "icon-nav",
49                  "url": "#"
50              }, {
51                  "menuid": "119",
52                  "menuname": "基础数据15",
53                  "icon": "icon-nav",
54                  "url": "em/enterpriseChannelObtend.action"
55 }]
56     }, {
57         "menuid": "20",
58         "icon": "icon-sys",
59         "menuname": "测试一",
60         "menus": [{
61             "menuid": "211",
62             "menuname": "测试一11",
63             "icon": "icon-nav",
64             "url": "#"
65         }, {
66             "menuid": "213",
67             "menuname": "测试一22",
68             "icon": "icon-nav",
69             "url": "#"
70 }]
71 }],
72             point: [{
73                 "menuid": "20",
74                 "icon": "icon-sys",
75                 "menuname": "邮件列表",
76                 "menus": [{
77                     "menuid": "211",
78                     "menuname": "邮件用途",
79                     "icon": "icon-nav",
80                     "url": "#"
81                 }, {
82                     "menuid": "213",
83                     "menuname": "邮件调整",
84                     "icon": "icon-nav",
85                     "url": "#"
86 }]
87 
88 }]
89                 };



源码下载

jQuery-Easyui-1.2-三层-Demo.rar


你可能感兴趣的:(jquery)