easyui树结构

最新推荐文章于 2023-12-26 18:19:23 发布

Monstar_hu

最新推荐文章于 2023-12-26 18:19:23 发布

阅读量357

点赞数

分类专栏： easyui

本文链接：https://blog.csdn.net/Monstar_hu/article/details/81739362

版权

easyui 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript"
   src="${pageContext.request.contextPath }/js/jquery.min.js"></script>
<script type="text/javascript"
   src="${pageContext.request.contextPath }/js/jquery.easyui.min.js"></script>
<script type="text/javascript"
   src="${pageContext.request.contextPath }/js/locale/easyui-lang-zh_CN.js"></script>
<link rel="stylesheet" type="text/css"
   href="${pageContext.request.contextPath }/js/themes/default/easyui.css">
<link rel="stylesheet" type="text/css"
   href="${pageContext.request.contextPath }/js/themes/icon.css">

   $(function(){
       $("#myTree").tree({
           'onDblClick' : function(node){
               if($("#myTree").tree("isLeaf", node.target)){
                   // 如果是叶子节点, 页面跳转, 刷新中间区域的内容
                   // 是中间区域内容刷新. 检查中间区域组件的属性或方法.
                   $("#workarea").panel({
                       // 在panel的href属性触发的时候, 自动追加一个请求参数
                       // 参数名: _, 参数值:随机数
                       // 作用是避免使用本地缓存.
                       'href':node.url
                   });
               }else{
                   // 如果不是叶子节点, 则展开或折叠节点信息.
                   // 判断当前节点是什么状态
                   if(node.state == 'open'){
                       // 展开状态
                       $("#myTree").tree("collapse", node.target);
                   }else{
                       // 折叠状态
                       $("#myTree").tree("expand", node.target);
                   }
               }
           }
       });
   });

</script>
</head>
<body class="easyui-layout">

   <div data-options="region:'north',split:false"
       style="height:50px; text-align:right; padding-right: 20px">
       测试EasyUI
   </div>
<div data-options="region:'south',split:false"
   style="height:30px; text-align:center; font-size:10px">
   www.bjsxt.com | 老金专用
</div>
<%-- <div data-options="region:'east',iconCls:'icon-reload',title:'East',split:true"
   style="width:100px;"></div> --%>
<div data-options="region:'west',title:'测试导航栏',split:false, collapsible:false"
   style="width:200px;">
   <ul id="myTree" class="easyui-tree"
           data-options="
                   animate:true,
                   checkbox:true,
                   cascadeCheck:true,
                   url:'${pageContext.request.contextPath }/getMenus'
           "></ul>

</div>
<div data-options="region:'center',title:'EasyUI工作区', iconCls:'icon-edit'"
   style="padding:5px;background:#eee;" id="workarea">
   测试工作区域
</div>

</body>
</html>

Monstar_hu

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
easyui树结构

&lt;%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%&gt;&lt;!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dt
复制链接

扫一扫