标签：
html代码：
<!DOCTYPE html> <html lang="zh-CN"> <head> <title><?php echo $Title ?></title> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1, user-scalable=no"> <meta name="apple-mobile-web-app-capable" content="yes"> <meta name="apple-mobile-web-app-status-bar-style" content="black"> <meta http-equiv="cache-control" content="max-age=0" /> <meta http-equiv="cache-control" content="no-cache" /> <meta http-equiv="expires" content="0" /> <meta http-equiv="expires" content="Tue, 01 Jan 1980 1:00:00 GMT" /> <meta http-equiv="pragma" content="no-cache" /> <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" /> </head> <body class="easyui-layout"> <?php CssLoader::easyui("black"); ?> <div data-options="region:‘north‘" style="height: 50px; line-height: 21pt; height: 41pt; font-size: 28px">微电商后台管理</div> <div data-options="region:‘west‘,split:true" title="West" style="width: 220px;"> <div class="easyui-accordion" data-options="fit:true,border:false"> <div title="基础信息管理" style="padding: 10px;" data-options="selected:true"> <ul class="easyui-tree" id="mytree"> </ul> </div> <div title="权限管理" style="padding: 10px;">content2</div> <div title="系统管理" style="padding: 10px">content3</div> </div> </div> <div data-options="region:‘center‘,title:‘Main Title‘,iconCls:‘icon-ok‘"> <div id="mytab" class="easyui-tabs" style="width:100%;height:100%"> <div title="测试加载页" style="padding:10px"> <iframe src="/index/" style="width: 100%;height: 100%;" scrolling="yes" frameborder="0"></iframe> </div> </div> <?php JsLoader::Jquery(); JsLoader::easyui(); JsLoader::LoadViewJs(CURRENT_THEME_ADMIN,"admin.js"); ?> </body> </html>
JS代码：
$(function(){ $("#mytree").tree({ //异步请求的地址 url:"/admin/tree", //为所有节点绑定点击时间，node为点击节点的DOM onClick:function(node) { //alert(node.text + "~" + node.state + "~" + node.id + "~" + node.attr.url); if(node.attr && node.attr.url) { addTab(node.text,node.attr.url); } } }) }) addTab = function(title, url) { if ($(‘#mytab‘).tabs(‘exists‘, title)) { $(‘#mytab‘).tabs(‘select‘, title); } else { var content = ‘<iframe scrolling="auto" frameborder="0" src="‘+url+‘" style="width:100%;height:100%;"></iframe>‘; $(‘#mytab‘).tabs(‘add‘, { title:title, content:content, closable:true }); } }
php代码：
//树主数组 $tree = array(); //商品操作 $prod_add = array("id"=>"2","text"=>"商品添加","state"=>"open","attr"=>array("url"=>"/index")); $prod_list = array("id"=>"3","text"=>"商品列表","state"=>"open"); $prod = array("id"=>"1","text"=>"商品管理","state"=>"open","children"=>array($prod_add,$prod_list)); //添加到树中 array_push($tree,$prod); //输出符合easyui树的json格式 exit(json_encode($tree));
sql：
-- ---------------------------- -- Table structure for `shop_tree` -- ---------------------------- DROP TABLE IF EXISTS `shop_tree`; CREATE TABLE `shop_tree` ( `id` int(11) NOT NULL AUTO_INCREMENT, `tree_text` varchar(255) DEFAULT NULL, `tree_url` varchar(255) DEFAULT NULL, `tree_state` varchar(255) DEFAULT ‘open‘, `pid` int(11) DEFAULT ‘0‘, PRIMARY KEY (`id`) ) ENGINE=InnoDB AUTO_INCREMENT=4 DEFAULT CHARSET=utf8; -- ---------------------------- -- Records of shop_tree -- ---------------------------- INSERT INTO `shop_tree` VALUES (‘1‘, ‘商品管理‘, ‘/index‘, null, ‘0‘); INSERT INTO `shop_tree` VALUES (‘2‘, ‘商品列表‘, ‘/index‘, ‘open‘, ‘1‘); INSERT INTO `shop_tree` VALUES (‘3‘, ‘商品添加‘, ‘/index‘, ‘open‘, ‘0‘);
标签：
原文地址：http://www.cnblogs.com/CyLee/p/5634016.html
