中小企业网站开发韵茵,网站开发培训培训班,怎么做发卡网站,上海企业网站建设费用本项目开发过程中涉及树状菜单#xff0c;于是做如下分享菜单实现 不足之处请大牛指点并见谅#xff08;如图#xff09; 1#xff1a;数据表涉及字段 id int(10) unsigned NOT NULL AUTO_INCREMENT COMMENT 系统菜单ID, pid int(10) DEFAULT NULL COMMENT 父级ID, name va…本项目开发过程中涉及树状菜单于是做如下分享菜单实现 不足之处请大牛指点并见谅如图 1数据表涉及字段 id int(10) unsigned NOT NULL AUTO_INCREMENT COMMENT 系统菜单ID, pid int(10) DEFAULT NULL COMMENT 父级ID, name varchar(200) DEFAULT NULL COMMENT 菜单名称, params varchar(200) DEFAULT NULL COMMENT url参数, sort tinyint(4) DEFAULT 1 COMMENT 排序, status tinyint(1) DEFAULT 1 COMMENT 菜单状态1显示 2隐藏 3删除, is_system tinyint(1) DEFAULT 0 COMMENT 是否系统菜单1是 0否, level tinyint(1) unsigned NOT NULL DEFAULT 1 COMMENT 菜单级别, 2html代码 volist namelist iditemtrtd{$item.id}/tdtd classfont-bold text-lefta classmenu_tree is-load0 menu-level{$item.level} onclickmenu_tree(this,close) hrefjavascript:void(0) note-id{$item.id} i classglyph-icon icon-plus/i {$item.name}/a /tdtd{$item.controller}/tdtd{$item.action}/tdtd{$item.params}/tdtd{$item.level}/tdtd{$item.sort}/tdtdif condition$item[status] eq 1显示elseif condition$item[status] eq 2 /隐藏else /删除/if/tdtda title href# data-placementtop classbtn medium ui-state-default data-original-titleEditspan classglyph-icon icon-edit button-content editMenuLayer data-id{$item.id}编辑/span/aa title data-id{$item.id} data-placementtop classbtn small bg-white tooltip-button menuDelete href# data-original-titleRemovespan classglyph-icon icon-remove /span删除/a/td/tr /volist 3加载html volist namelist iditem tr classsub_menu{$item[level]}td{$item.id}/tdtd classfont-bold text-left php//空格$space;for($i0;$i($item[level]-1)*2;$i){$space .nbsp;nbsp;;} echo $space;/phpa classmenu_tree menu-level{$item.level} onclickmenu_tree(this,close) hrefjavascript:void(0) is-load0 note-id{$item.id} i classglyph-icon icon-plus/i {$item.name}/a /tdtd{$item.controller}/tdtd{$item.action}/tdtd{$item.params}/tdtd{$item.level}/tdtd{$item.sort}/tdtdif condition$item[status] eq 1显示elseif condition$item[status] eq 2 /隐藏else /删除/if/tdtda title href# data-placementtop classbtn medium ui-state-default data-original-titleEditspan classglyph-icon icon-edit button-content editMenuLayer data-id{$item.id}编辑/span/aa title data-id{$item.id} data-placementtop classbtn small bg-white tooltip-button menuDelete href# data-original-titleRemovespan classglyph-icon icon-remove /span删除/a/td/tr /volist 4js代码 script//树状菜单function menu_tree(a,type){var note_id $(a).attr(note-id);var is_load $(a).attr(is-load);var level $(a).attr(menu-level);if(typeclose){
var url{:U(Menu/sub_menu)}//是否已经加载if(is_load!1){$.post(url,{id:note_id},function(data){if(data.status1){ $(a).attr(onclick,menu_tree(this,open)); $(a).children(i).removeClass(icon-plus); $(a).children(i).addClass(icon-minus);$(a).attr(is-load,1);$(a).parent(td).parent(tr).after(data.info);}},json);}else{$(a).attr(onclick,menu_tree(this,open)); $(a).children(i).removeClass(icon-plus); $(a).children(i).addClass(icon-minus);//显示下级$(a).parent(td).parent(tr).nextUntil(.sub_menulevel).show();}}else{//隐藏下级 $(a).parent(td).parent(tr).nextUntil(.sub_menulevel).hide();$(a).children(i).removeClass(icon-minus);$(a).children(i).addClass(icon-plus);$(a).attr(onclick,menu_tree(this,close));}}/script 转载于:https://www.cnblogs.com/chenfeizhou/p/5596174.html