jquery ztree carian tak segerak (carian daun) practice_jquery

1. Pokok pemuatan tak segerak

Permulaan memberikan nod akar secara lalai, dan kemudian menggabungkan kaedah pemuatan tak segerak untuk mencetuskan pemuatan lalai lapisan pertama secara manual, seperti ditunjukkan dalam rajah:

Kod adalah seperti berikut:

var treeSetting = {
 async: {
 enable: true, <a href="http://my.oschina.net/wealpan/admin/"xxx/demo.do&#63;method=listByTree" rel="nofollow">url:"xxx/demo.do&#63;method=listByTree</a>",
 dataType:"json",
 autoParam:["id=pid"]
 },
 view: {
 dblClickExpand: true,
 selectedMulti: false,
 expandSpeed: ($.browser.msie && parseInt($.browser.version)<=6)&#63;"":"fast"
 },
 data: {
  simpleData: {
   enable:true,
   idKey: "id",
   pIdKey: "pid",
   rootPId: "root"
  }
 },
 callback: {
  onNodeCreated: zTreeOnNodeCreated
 }
};
 
//默认根结点
var rootNode = {"id":0, "pid":"root", "name":"商品分类", "open":true, "isParent":true};
 
$(document).ready(function(){
 var zTreeObj = $.fn.zTree.init($("#tree"), treeSetting, rootNode);
 var node = zTreeObj.getNodeByParam("id", 0, null);
 zTreeObj.reAsyncChildNodes(node, "refresh");
});

2. Carian tak segerak untuk nod daun

Apabila menggunakan JQuery ZTREE, anda mungkin perlu menggunakan carian kabur tak segerak untuk nod daun, seperti yang ditunjukkan dalam rajah:

Jika anda hanya menggunakan kaedah pengembangan ZTREE sendiri zTreeObj.expandNode, ia hanya akan mengembangkan titik perubahan dan tidak boleh mencetuskan pemuatan tak segerak Pada masa ini, anda mesti memanggil kaedah pemuatan tak segerak untuk pemprosesan adalah seperti berikut:
Bawa parameter carian ke latar belakang dengan menetapkan nilai dalam tatasusunan otherParam (apabila tiada parameter, otherParam mesti ditetapkan kepada tatasusunan kosong, jika tidak, parameter sebelumnya akan sentiasa dibawa ke latar belakang dalam fungsi panggil balik onNodeCreated). selepas nod dicipta Lakukan pemuatan tak segerak manual.

Kod adalah seperti berikut:

function searchM() {
 var param = $.trim($("input[name='param']").val());
 var treeObj = $.fn.zTree.getZTreeObj("tree");
 var node = treeObj.getNodeByParam("id", 0, null);
 if(param != ""){
  param = encodeURI(encodeURI(param));
  treeObj.setting.async.otherParam=["param", param];
 }else {
  //搜索参数为空时必须将参数数组设为空
  treeObj.setting.async.otherParam=[];
 }
 treeObj.reAsyncChildNodes(node, "refresh");
}
 
function zTreeOnNodeCreated(event, treeId, treeNode) {
 var param <span></span><span></span>= $.tr<span></span>im($("input[name='param']").val());
 var treeObj = $.fn.zTree.getZTreeObj("tree");
 //只有搜索参数不为空且该节点为父节点时才进行异步加载
 if(param != "" && treeNode.isParent){
  treeObj.reAsyncChildNodes(treeNode, "refresh");
 } 
};

Di atas adalah mengenai carian tak segerak jquery ztree. Saya harap ia akan membantu pembelajaran semua orang.