浏览 2481 次
|
精华帖 (0) :: 良好帖 (0) :: 新手帖 (0) :: 隐藏帖 (0)
|
|
|---|---|
| 作者 | 正文 |
|
发表时间：2008-10-09
从后台代码直接返回json对象就可以显示成菜单了
<HTML> <HEAD> <style> body,td{ font-size:9pt;margin:0;overflow:hidden;border:0; } .PopMenuOutset{border:1px solid;border-color: buttonface threeddarkshadow threeddarkshadow buttonface;FILTER: progid:DXImageTransform.Microsoft.Shadow(direction=135,color=buttonshadow,strength=3); } .PopMenuInset{border:1px solid;border-color: buttonhighlight buttonshadow buttonshadow buttonhighlight;} .PopMenu{background-color: buttonface;} .PopMenuItem{height:18px;cursor:default;} .PopMenuItemOver{height:18px;background-color: highlight;color:highlighttext;cursor:default;} .PopMenuItemOver img{height:18px;background-color: highlight;color:highlighttext;cursor:default;} </style> <SCRIPT LANGUAGE="JScript"> var Menu={ MenuItem:[ { id:1, title:"menu1", MenuItem:[ {id:11,title:"menu11"},{id:12,title:"menu12",MenuItem:[{id:121,title:"menu121"}]} ] }, { id:2, title:"menu2" }, { id:3, title:"menu3" } ] } // 当前展开的菜单项 var preObj = null; // 创建当前窗体（可以是IE窗体也可以是Popup窗体）的Popup对象 // 这个Popup对象就是用来存储子菜单数据的 var oPopup = document.parentWindow.createPopup(); // 鼠标经过菜单项 function ItemOver(obj) { // 隐藏已经打开的菜单项 if (preObj != null) { if (preObj == obj) return; oPopup.hide(); // 要清空原Popup中的数据——document.write()方法是接着原来的内容往里面写，所以如果不清空会出现重复数据 oPopup = document.parentWindow.createPopup(); // 恢复前一个菜单项的状态 ItemNormal(preObj); preObj = null; } if (obj.cells(2).children.length > 0) //有子菜单 { // 根据子菜单xml数据和当前xsl文档生成HTML var sHtml = document.documentElement.outerHTML; sHtml=sHtml.replace(/<TABLE class(=+[\s\S]*)<\/TD><\/TR><\/TBODY><\/TABLE><\/TD><\/TR><\/TBODY><\/TABLE><\/TD><\/TR><\/TBODY><\/TABLE>/ig,''); sHtml=sHtml.replace(/document.write\(ShowMenu\(([^\(]*)\)\)/,'document.write(ShowMenu("'+obj.cells(1).id+'"))'); oPopup.document.write(sHtml); // 计算popup内容的实际宽度高度 oPopup.show(0, 0, 1, 1, document.body); var width = oPopup.document.body.scrollWidth; var height = oPopup.document.body.scrollHeight; oPopup.hide(); // 显示菜单 oPopup.show(obj.offsetWidth, 0, width, height, document.body); preObj = obj; obj.cells(2).children(0).src = "images/ArrowRHighlight.gif"; } obj.className='PopMenuItemOver'; } function ItemClick(obj) { ItemOver(obj); } // 鼠标移出菜单项 function ItemOut(obj) { if (oPopup.isOpen && preObj == obj) // 如果子菜单被打开则跳过 return; ItemNormal(obj); } // 恢复到菜单项的默认状态 function ItemNormal(obj) { obj.className='PopMenuItem'; if (obj.cells(2).children.length > 0) { obj.cells(2).children(0).src = "images/ArrowR.gif"; } } function ShowMenu(id){ var shtml=""; shtml+="<table id=popupmenu border='0' cellpadding='0' cellspacing='0' width='110' class='PopMenuOutset' >"; shtml+="<tr><td><table border='0' cellpadding='1' cellspacing='0' width='100%' class='PopMenuInset'>"; shtml+="<tr><td class='PopMenu'><table border='0' cellpadding='0' cellspacing='0' width='100%' onselectstart='return false;'>"; for (var i=0; i< eval(id+".length");i++){ shtml+="<tr height=18 onmouseover='ItemOver(this)' onmouseout='ItemOut(this)' onclick='ItemClick(this)' >"; shtml+="<td width='17' align='center'><IMG SRC='images/dot1.gif' WIDTH='6' HEIGHT='6' BORDER='0' ALT=''/></td>"; shtml+="<td id='"+id+"["+i+"].MenuItem'>"+eval(id+"["+i+"].title")+"</td>"; shtml+="<td width='20' align='right' valign='top' style='padding-right: 6px; padding-top:4px;'>"; if (eval(id+"["+i+"].MenuItem")!=null) shtml+="<img src='images/arrowR.gif'/>"; shtml+="</td></tr>"; } shtml+="</table></td></tr></table></td></tr></table>"; return shtml; } </SCRIPT> </head> <body> <script>document.write(ShowMenu("Menu.MenuItem"));</script> </body> </html> 声明：ITeye文章版权属于作者，受法律保护。没有作者书面许可不得转载。
推荐链接
|
| 返回顶楼 | |
