jQuery ztree实现动态树形多选菜单

我用到的版本ztree core v3.5.24，需要引入的js，css，jquery.js，jquery.ztree.core.js，jquery.ztree.excheck.js（多选框可选），zTreeStyle.css。
需要注意的指向父节点的pId，我开始写的是pid一开始没注意，默认的是pId，当然可以pIdKey指定自定义的（未测）。还有如果图片没显示肯定是没引入img图片，记得写好路径。

1、先介绍初始化加载ztree

 jsp

<div >  <ul id="treeDemo" class="ztree" style="margin-top: 0; width: 160px;">  </ul> </div>

js

<script type="text/javascript">$(function(){ $.ajax({   url: '${contextPath}/om/quoteOmRequest.do?flag=init',  data: {    name : '1' //随便写的，传入后台的值  },  type:'post',  traditional: true,  success: function(data){   var dataObj = eval(data);   var zTreeObj;   var setting = {     data: {       simpleData: {        enable:true,        /* idKey: "id",        pIdKey: "pId" */       }      },     check: {      enable: true,      chkboxType :{ "Y" : "", "N" : "s" } //Y:勾选（参数：p:影响父节点），N：不勾（参数s：影响子节点）[p 和 s 为参数，参数都不写""为全不影响]     },     callback: {      onCheck:         function() {          var zTree = $.fn.zTree.getZTreeObj("treeDemo");         var checkCount = zTree.getCheckedNodes(true);         var classpurview = "";         for(var i=0;i<checkCount.length;i++) {           classpurview += checkCount[i].id+","  //存入数据的id，比如这种形式"1,2,5," 后台截取下         }         /* alert(classpurview); */       } ,     },     view: {       showLine: true,       showIcon: true,       dblClickExpand: true      },    };   var zNodes = dataObj;    $(document).ready(function(){    $.fn.zTree.init($("#treeDemo"), setting, zNodes);   });  },  error : function() {    alert("异常！");   } });});</script>

后台部分可以参考2延迟加载

2、延迟加载ztree
jsp一样的，js有所有区别，这个参考了官方api

<script type="text/javascript">var setting = {  view: {   selectedMulti: false  },  check: {   enable: true,   chkboxType :{ "Y" : "", "N" : "s" } //Y:勾选（参数：p:影响父节点），N：不勾（参数s：影响子节点）[p 和 s 为参数，参数都不写""为全不影响]  },  async: {   enable: true,   url:"${contextPath}/om/quoteOmRequest.do?flag=ajax",   autoParam:["id"],    dataFilter: filter  },  callback: {   beforeClick: beforeClick,  } }; function filter(treeId, parentNode, childNodes) {  if (!childNodes) return null;  for (var i=0, l=childNodes.length; i<l; i++) {   childNodes[i].name = childNodes[i].name.replace(//.n/g, '.');  }  return childNodes; } function beforeClick(treeId, treeNode) {  if (!treeNode.isParent) {   alert("请选择父节点，此节点是根节点...");   return false;  } else {   return true;  } } $(document).ready(function(){  $.fn.zTree.init($("#treeDemo"), setting); });</script>