webmenu编程精彩历程(二)菜单xml数据规划

菜单数据规划:

采用xml数据岛形式,节点形式如下:

1<menuitem func="" hassub="1" headcolumn="2" img="addNew.gif" subwidth="200" text="一级菜单项2"/>

各属性说明:
Func:菜单项上点击时候触发的函数
Text:菜单项文本
img:菜单项左侧的图片
hasSub:是否有下级菜单
HeadColumn:菜单项头部由几项组成,1为仅含图片或者可勾选项 2为同时包含可勾选项和图片项
subWidth:子菜单宽度
hasLine:在该菜单项下画一分隔线
checked:是否被选中
isCheckItem:是否是可构选项

关于各个属性,需要说明的是

1。除了Func和Text节点,其他都不是必须的,仅当需要的时候才需要加上。
2。如果hasSub=1,则subWidth为必需的,这里指定宽度后能够避免后面计算的麻烦。
3。Root下第一个节点只需要且必须要 hasSub="" subWidth="" ,在没有任何菜单的时候这是必须的。

 1<root>
 2<menuitem hassub="1" subwidth="160"/>
 3<menuitem func="" img="save.gif" text="一级菜单项1">
 4<menuitem func="" hassub="1" headcolumn="2" img="addNew.gif" subwidth="200" text="一级菜单项2"/>
 5<menuitem checked="1" func="" img="" ischeckitem="1" text="二级级菜单项3">
 6<menuitem checked="1" func="" img="" ischeckitem="1" text="二级级菜单项3">
 7<menuitem func="" img="addnew.gif" ischeckitem="1" text="二级级菜单项3"/>
 8<menuitem func="" img="" ischeckitem="1" text="二级级菜单项3"/>
 9<menuitem func="" img="" ischeckitem="1" text="二级级菜单项3"/>
10<menuitem func="" img="" ischeckitem="1" text="二级级菜单项3"/>
11<menuitem func="" img="" ischeckitem="1" text="二级级菜单项3"/>
12<menuitem func="" img="" ischeckitem="1" text="二级级菜单项3"/>
13<menuitem checked="1" func="" img="save.gif" ischeckitem="1" text="二级级菜单项3"/>
14<menuitem checked="1" func="" img="" ischeckitem="1" text="二级级菜单项3"/>
15<menuitem func="" img="" ischeckitem="1" text="二级级菜单项3"/>
16<menuitem func="" img="" ischeckitem="1" text="二级级菜单项3"/>
17<menuitem func="" img="" ischeckitem="1" text="二级级菜单项3"/>
18<menuitem func="" img="" ischeckitem="1" text="二级级菜单项3"/>
19<menuitem func="" img="" ischeckitem="1" text="二级级菜单项3"/>
20<menuitem func="" img="" ischeckitem="1" text="二级级菜单项3"/>
21<menuitem func="" img="" ischeckitem="1" text="二级级菜单项3"/>
22</menuitem>
23<menuitem func="" hasline="1" img="REFRESH.GIF" text="一级菜单项3"/>
24<menuitem func="" img="" text="一级菜单项4"/>
25<menuitem func="" hassub="1" img="" subwidth="160" text="一级菜单项5"/>
26<menuitem func="" hasline="1" img="Edit.gif" text="二级级菜单项3">
27<menuitem func="" img="" text="二级级菜单项3"/>
28<menuitem func="" hassub="1" img="" subwidth="160" text="二级级菜单项3"/>
29<menuitem func="" hasline="1" img="SendEmail.gif" text="三级级菜单项4">
30<menuitem func="" img="" text="三级级菜单项4"/>
31<menuitem func="" img="" text="三级级菜单项4"/>
32</menuitem>
33</menuitem>
34<menuitem func="" img="Search.gif" text="一级菜单项6"/>
35</menuitem>
36</menuitem></root>

上述数据在Testmenu.html用以下语句装载到页面里面:

1<xml id="xmlData" src="MenuData.xml"></xml>
Published At
Categories with Web编程
Tagged with
comments powered by Disqus