JQuery写动态树示例代码

复制代码 代码如下:

  // 业务类型树

  var settingOther = {

  edit: {

  enable: false

  },

  // 异步加载树

  async: {

  enable: true,

  url:"initCoagencyTree.action",

  autoParam:["id", "name=n"],

  otherParam:{"otherParam":"zTreeAsyncTest"},

  dataFilter: filter

  },

  // 简单数据格式

  data: {

  simpleData: {

  enable: true

  }

  },

  // 回调函数

  callback: {

  beforeClick: beforeClick,

  onClick: onClick

  }

  };

  // 鼠标事件

  function beforeClick(treeId, treeNode, clickFlag) {

  // 普通选中

  if(clickFlag==1){

  parent.document.getElementById("coagencyId").value=treeNode.id;

  parent.document.getElementById("parentId").value=treeNode.pId;

  parent.document.getElementById("name").value=treeNode.name;

  $("#coagencyId").attr("value",treeNode.id);

  $("#parentId").attr("value",treeNode.pId);

  }else{

  // 取消选中 把值置空

  $("#coagencyId").attr("value",null);

  $("#parentId").attr("value",null);

  }

  return (treeNode.click != false);

  }

  // 鼠标解除节点的方法

  function onClick(event, treeId, treeNode, clickFlag) {

  // 默认执行的方法 显示节点的详细信息

  parent.showCoagencyDetail();

  }

  // 异步加载需要是函数

  function filter(treeId, parentNode, childNodes) {

  if (!childNodes) return null;

  for (var i=0; i<childNodes.length; i++) {

  childNodes[i].name = childNodes[i].name.replace(/\.n/g, '.');

  }

  return childNodes;

  }

  // 异步加载需要是函数

  function beforeAsync(treeId, treeNode) {

  return treeNode ? treeNode.level < 5 : true;

  }

  // 初始化树

  $(document).ready(function(){

  $.fn.zTree.init($("#coagencyTree"),settingOther);

  });

  </SCRIPT>

  <!-- 树节点id -->

  <s:hidden name="coagencyForm.coagencyId" id="coagencyId"/>

  <!-- 树节点 父id -->

  <s:hidden name="coagencyForm.parentId" id="parentId"/>

  <div class="zTreeDemoBackground left">

  <ul id="coagencyTree" class="ztree" style="height: 640px"></ul>

  </div>