Maison > interface Web > js tutoriel > le corps du texte

Cinq étapes pour implémenter facilement des exemples d'utilisation de zTree

小云云
Libérer: 2017-12-28 11:48:43
original
4180 Les gens l'ont consulté

Cet article présente principalement cinq étapes pour mettre en œuvre facilement l'utilisation de zTree. Il a une certaine valeur de référence. Les amis intéressés peuvent s'y référer. J'espère qu'il pourra aider tout le monde.

1. Importez le fichier de configuration zTree


<script type="text/javascript" src="../js/ztree/jquery.ztree.all-3.5.js"></script> 
<link rel="stylesheet" href="../js/ztree/zTreeStyle.css" />
Copier après la connexion

2. Définissez class="ztree"
à l'emplacement requis


<p data-options="title:&#39;基础菜单&#39;"> 
   <ul id="baseMenu" class="ztree"></ul> 
</p>
Copier après la connexion

3. Choisissez de générer un format zTree simple ou un format zTree standard selon vos besoins (seulement simple ici) ps : Attention à bien écrire dans la fonction après la page est chargée.


var setting = { 
  data: { 
    simpleData: { 
      enable: true //支持json格式 
  } 
},
Copier après la connexion

4. Écrivez un menu arborescent (simple et similaire à dTree)

<🎜. >

var zNodes = [ //驼峰式命名pId 
  {id:1,pId:0,name:"父节点1"},       
  {id:2,pId:0,name:"父节点2"},           
  {id:11,pId:1,name:"父1子节点1"}, 
  {id:12,pId:1,name:"父1子节点2"}, 
];
Copier après la connexion
5. Générer un menu arborescent



$.fn.zTree.init($("#baseMenu"), setting, zNodes);
Copier après la connexion
Recommandations associées :


Exemple détaillé de zTree jQuery Utilisation du plug-in d'arborescence

Explication de jQuery utilisant le plug-in zTree pour implémenter la fonction glisser-déposer

Partage sur l'utilisation du plug-in d'arborescence zTree dans jQuery

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal