一.树 tree
属性:
id:
text:
state:"open"/"closed"
iconcls:'icon-user_home'
children:[子节点]
数据来自json
父节点
子节点
判断其是不是字节点 getchildren
二,选项卡 tabs
判断其是否存在 exists 存在就让其选中 select 不存在就新增一个
三,easyui 如何使用图表
更新icons图标库 icon.css
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!-- 引入公共页面 包含 -->
<%@include file="common/head.jsp"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javescript">
//页面载入函数
$(function(){
//加载树的数据
$('#myTree').tree({
url:ctx+'/data/tree_datal.json'//请求地址
onclick:function(node){//节点
alert(node.text);//在用户点击的时候提示
//判断是否是字节点
var nodes=$('myTree').tree('get')
alert(nodes.length==0){//说明没有字节点
}
});
$('#mytree').tree({
url:'/data/tree_datal.json'//请求地址
animate:true,//展开或者收缩节点显示动画效果
onDblclick:function(node){//节点=对象
//alert(node.text+""+node.id+" "+node.statac);
$('#myTab').tabs('add',{
title:node.text,//标题
content:node.text,//内容
closable:true,//是否可以关闭
tools:[{
inconcls:'icon-mimi-refresh',
handler:function(){
alert('111');
}
}}
});
}
</script>
</head>
<body class="easyui-layout">
<div data-options="region:'north',split:true" style="height:85px"></div>
<h1>书籍后台管理${ctx}</h1>
</div>
<div data-options="region:'south',split:true" style="height:68px"></div>
<h4>©沉山工作室版权所有, 违权使用必究</h4>
</div>
<div data-options="region:'west',title:'功能导航' split:true" style="height:50px;"></div>
<!-- 左侧tree控件 -->
<ul id="myTree"class="easyui-tree"></ul>
</div>
<div id="mytab" date-options="easyui-tabs"style="winth:>
<div data-options="iconcls:'icon'="首页"style="padding">
<div id="mytab"class="eaasyui-tabs" style=winth:100% ">
</body>
</html>