


JQuery ztree avec filtrage et chargement asynchrone examples_jquery
May 16, 2016 pm 03:13 PMCet article partage un exemple de JQuery ztree avec filtrage et chargement asynchrone pour votre référence. Le contenu spécifique est le suivant
.<html> < head> < base href="<%=basePath%>"> <title>My JSP 'ztree.jsp' starting page</title> <link rel="stylesheet" href="zTrees/css/zTreeStyle/zTreeStyle.css" type="text/css"> < script type="text/javascript" src="zTrees/js/jquery-1.4.4.min.js"></script> < script type="text/javascript" src="zTrees/js/jquery.ztree.core-3.5.js"></script> < script type="text/javascript" src="zTrees/js/jquery.ztree.excheck-3.5.js"></script> < script type="text/javascript" src="zTrees/js/jquery.ztree.exedit-3.5.js"></script> < script type="text/javascript" src="zTrees/js/jquery.ztree.exhide-3.5.js"></script> < SCRIPT type="text/javascript"> $(function() { var setting = { async : { //异步加载 type : "post", enable : true, url : getUrl }, check : { enable : true }, data : { simpleData : { enable : true } }, callback : { onClick : nodeClick, onCheck : nodeCheck } }; $.fn.zTree.init($("#treeDemo"), setting); }); //返回地址 function getUrl(treeId, treeNode) { return "***.do?method=listXMLTree&****Sid=100"; } //单击节点 function nodeClick(event, treeId, treeNode) { //alert(treeId+treeNode.id+treeNode.mobileNO); var treeObj = $.fn.zTree.getZTreeObj("treeDemo"); var sNodes = treeObj.getSelectedNodes(); if (sNodes.length> 0) { if (!treeNode.isParent) { $.ajax({ type : 'POST', url : '***.do?method=listXMLChildren', data : {'****Sid' : treeNode.id}, dataType : 'text', async : false, success : function(dat) { var dats = eval(dat); if (dats.length != 0) { //var treeObj = $.fn.zTree.getZTreeObj("treeDemo"); //treeObj.addNodes(treeNode, dats); treeObj.addNodes(treeNode, dats); } } }); } else { treeObj.expandNode(treeNode); } } } //选中节点 function nodeCheck(event, treeId, treeNode) { var treeObj = $.fn.zTree.getZTreeObj("treeDemo"); nodes = treeObj.getCheckedNodes(true); var str = ""; for ( var i = 0, l = nodes.length; i < l; i++) { //alert(nodes[i].id + nodes[i].mobileNO); if (nodes[i].mobileNO != null) { str += nodes[i].name + ":" + nodes[i].mobileNO + ";"; } } $('#mtDstName').val(str); } //监听搜索框 $(function() { $('#sch').bind('input propertychange', function() { var treeObj = $.fn.zTree.getZTreeObj("treeDemo"); var value = $('#sch').val(); nodeList = treeObj.getNodesByParamFuzzy('name', value); nodes = treeObj.getNodes(); treeObj.hideNodes(nodes[0].children); treeObj.showNodes(nodeList); }); }); < /SCRIPT> < /head> < body> 搜索:<input type="text" id="sch"> <!-- < input type="button" id="btnSch" value="搜索">--> <br> 树状: <div style="height:300px;width:200px;"> <ul id="treeDemo" class="ztree"></ul> </div> <div align="center"> 名单: <textarea id="mtDstName" name="mtDstName" readonly></textarea> </div> < /body> < /html>
Opérations de fonctions spécifiques :
Recherche comité municipal :
Ce qui précède est ztree avec des fonctions de filtrage et de chargement asynchrone. J'espère que vous pourrez avoir une compréhension approfondie de ztree grâce aux articles récents.

Article chaud

Outils chauds Tags

Article chaud

Tags d'article chaud

Bloc-notes++7.3.1
Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise
Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1
Puissant environnement de développement intégré PHP

Dreamweaver CS6
Outils de développement Web visuel

SublimeText3 version Mac
Logiciel d'édition de code au niveau de Dieu (SublimeText3)

Sujets chauds

Explication détaillée des méthodes de référence jQuery : guide de démarrage rapide

Comment utiliser la méthode de requête PUT dans jQuery ?

Comment supprimer l'attribut height d'un élément avec jQuery ?

Conseils jQuery : modifiez rapidement le texte de toutes les balises a de la page

Analyse approfondie : les avantages et les inconvénients de jQuery

Utilisez jQuery pour modifier le contenu textuel de toutes les balises

Comprendre le rôle et les scénarios d'application de eq dans jQuery

Résumé des fonctions d'opération de fichiers couramment utilisées en PHP
