超多树形结构的JavaScript菜单实例

  • z3_261134
    了解作者
  • 98.8KB
    文件大小
  • rar
    文件格式
  • 0
    收藏次数
  • VIP专享
    资源类型
  • 0
    下载次数
  • 2022-04-17 03:27
    上传日期
内容索引:脚本资源,Ajax/JavaScript,树形菜单  超多树形结构的JavaScript菜单实例,树控菜单,有大家常用的展开折叠型,也就是节点树;还有的是多级的菜单,类似树型,右键菜单树,还有的是悬浮层树,都比较不错,希望大家喜欢。
A105503932-14302.rar
内容介绍
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <link rel="stylesheet" href="admin.css" /> </head> <body> <div id="treemenu" class="treemenu"> <ol> <li>这里右键菜单区域。</li> <li><a href="http://www.codefans.net" target="_blank" rel='nofollow' onclick='return false;'>右击我你可以看属性哦。</a></li> <li>你也可以选择我再右击复制。</li> <li><select><option>你能遮住我吗?</option></select></li> </ol> </div> <script type="text/javascript" src="getmenu.js" charset="gb2312"></script> <script type="text/javascript" src="ContextMenu.js"></script> <script type="text/javascript"> //ContextMenu var contextmenu = new ContextMenu({ container : document.getElementById('treemenu') }); contextmenu.push( { html : 'Powered By: Jonllen', css : 'disabled'}); contextmenu.push( { html : '', css : 'line'}); contextmenu.push( { html : '刷新(<u>R</u>)', href : 'javascript:location.reload();'}); for(var i=0;i<menu.length;i++) { contextmenu.push({ id : menu[i].id, level : menu[i].level, parentId : menu[i].parentId, html : menu[i].name, href : menu[i].url }); } contextmenu.render(); //原有回调函数 var contextmenuOnShow = contextmenu.onShow; //设置新的回调函数 contextmenu.onShow = function (target, _this){ var item = target.treemenu || target.parentNode.treemenu; if( item ) { var html = '添加“'+item.html+'子节点'+(item.children.length+1)+'”'; _this.push( { html : html, click : function (e){ item.expand = false; var newItem = { id : item.id + '0'+ (item.children.length+1), level : item.level + 1, parentId : item.id, html : item.html+'子节点'+(item.children.length+1), href : '#', css : 'item', createExpand : true }; item.children.push(newItem); treemenu.list.push(newItem); treemenu.renderChild(item); }, clickClose : true, index : 1, type : 'dynamic' }); _this.push( { html : '删除节点“'+item.html+'”', click : function (e){ if( confirm('是否确认删除节点“'+item.html+'”?')) treemenu.remove(item); }, clickClose : true, index : 2, type : 'dynamic' }); } contextmenuOnShow(target, _this); }; contextmenu.render(document.getElementById('contextmenu')); </script> </body> </html>
评论
    相关推荐