jQuery.ztree -2.6 给每个节点绑定事件

最新推荐文章于 2019-06-28 15:34:57 发布

爱喝酒的程序员

最新推荐文章于 2019-06-28 15:34:57 发布

阅读量2.4k

点赞数 1

本文链接：https://blog.csdn.net/qq_36856975/article/details/78193038

版权

具体页面代码，重点设置为黄色标注：

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%
   String path = request.getContextPath();
   String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html>
<html lang="en">
   <head>
   <base href="<%=basePath%>">
   <meta charset="utf-8" />
   <script type="text/javascript" src="static/js/jquery-1.7.2.js"></script>
   <link type="text/css" rel="stylesheet" href="plugins/zTree/2.6/zTreeStyle.css"/>
   <script type="text/javascript" src="plugins/zTree/2.6/jquery.ztree-2.6.min.js"></script>
<body>

<table style="width:100%;" border="0">
   <tr>
       <td style="width:15%;" valign="top" bgcolor="#F9F9F9">
           <div style="width:15%;">
               <ul id="leftTree" class="tree"></ul>
           </div>
       </td>
       <td style="width:85%; " valign="top" >
           <iframe name="treeFrame" id="treeFrame" frameborder="0"
               src="<%=basePath%>/orgemp/listOrgs" style="margin:0 auto;width:100%;height:100%; ">
           </iframe>
       </td>
   </tr>
</table>

<script type="text/javascript">
       $(top.hangge());
       var zTree;
       $(document).ready(function(){
           var setting = {   //设置ztree相关属性
               isSimpleData : true,              //数据是否采用简单 Array 格式，默认false
                  treeNodeKey : "id",               //在isSimpleData格式下，当前节点id属性
                  treeNodeParentKey : "pId",        //在isSimpleData格式下，当前节点的父节点id属性
                showLine: true,
                checkable: false,

                callback:{ //回调函数,给每个节点绑定事件
                    beforeClick: getCurrentNode,
                    onClick : zTreeOnClick
                }
           };

           var zn = '${zTreeNodes}';
           var zTreeNodes = eval(zn);
           zTree = $("#leftTree").zTree(setting, zTreeNodes);
       });
       //jQuery ztree 给每个节点绑定事件
       function getCurrentNode(leftTree, treeNode) {
            curNode = treeNode;
            zTreeOnClick(curNode);
       }
       function zTreeOnClick(treeNode){
           /**
           * 根据部门去提交子页面的表单
           */
           //1.先找到子页面对应的下拉选，给部门赋值。
           $(window.frames["treeFrame"].document).find("#org_id").find("option:selected").val(treeNode.id);
           //2.提交子页面表单方法，searchs()为我子页面上提交form表单的方法。
           document.getElementById("treeFrame").contentWindow.searchs();//提交子页面表单
       }

       function treeFrameT(){
           var hmainT = document.getElementById("treeFrame");
           var bheightT = document.documentElement.clientHeight;
           hmainT .style.width = '100%';
           hmainT .style.height = (bheightT-26) + 'px';
       }
       treeFrameT();
       window.οnresize=function(){
           treeFrameT();
       };

</SCRIPT>
</body>
</html>

爱喝酒的程序员

关注

1
点赞
踩
2

收藏

觉得还不错? 一键收藏
1
评论
jQuery.ztree -2.6 给每个节点绑定事件

具体页面代码，重点设置为黄色标注： String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";%>
复制链接

扫一扫