五步輕松實現(xiàn)zTree的使用
更新時間：2017年11月01日 11:47:22 作者：冷宮旋
這篇文章主要為大家詳細(xì)介紹了五個步驟輕松實現(xiàn)zTree的使用，具有一定的參考價值，感興趣的小伙伴們可以參考一下
本文為大家分享了松實現(xiàn)zTree的使用的具體步驟，供大家參考，具體內(nèi)容如下
1、導(dǎo)入zTree的配置文件
<script type="text/javascript" src="../js/ztree/jquery.ztree.all-3.5.js"></script> <link rel="stylesheet" href="../js/ztree/zTreeStyle.css" />
2、在所需要的位置設(shè)置class="ztree"
<div data-options="title:'基礎(chǔ)菜單'"> <ul id="baseMenu" class="ztree"></ul> </div>
3、根據(jù)需要選擇生成簡單zTree格式還是標(biāo)準(zhǔn)zTree格式(這里只講簡單)ps:注意要在頁面加載完成后的function里面寫
var setting = {
data: {
simpleData: {
enable: true //支持json格式
}
},
4、編寫樹形菜單(簡單和dTree差不多)
var zNodes = [ //駝峰式命名pId
{id:1,pId:0,name:"父節(jié)點1"},
{id:2,pId:0,name:"父節(jié)點2"},
{id:11,pId:1,name:"父1子節(jié)點1"},
{id:12,pId:1,name:"父1子節(jié)點2"},
];
5、生成樹形菜單
$.fn.zTree.init($("#baseMenu"), setting, zNodes);
以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。
相關(guān)文章
這篇文章主要介紹了jquery實現(xiàn)郵箱自動補全功能，大家參考使用吧2014-02-02
這篇文章主要介紹了Jquery焦點圖實例代碼,詳細(xì)講述了使用jQuery實現(xiàn)焦點圖的詳細(xì)步驟,代碼中備有較為詳盡的注釋說明,便于大家理解,需要的朋友可以參考下2014-11-11
有了jquery一切變的如此簡單！讓js做的動畫更有動感。2010-04-04
這篇文章主要介紹了jQuery AjaxUpload 上傳圖片代碼的相關(guān)資料,需要的朋友可以參考下2016-02-02
JQuery 自定義CircleAnimation，Animate方法學(xué)習(xí)筆記
最近對看了一些JQuery的基礎(chǔ)教程，被JQuery深深的吸引住了，以前用過Extjs，看了JQuery不禁感嘆，javascript還能這么些，真是太神奇了！2011-07-07
jQuery UI Dialog 創(chuàng)建友好的彈出對話框?qū)崿F(xiàn)代碼
jQuery UI Dialog是jQuery UI的彈出對話框組件，使用它可以創(chuàng)建各種美觀的彈出對話框；它可以設(shè)置對話框的標(biāo)題、內(nèi)容，并且使對話框可以拖動、調(diào)整大小、及關(guān)閉；平常主要用來替代瀏覽囂自帶的alert、confirm、open等方法2012-04-04
JqGrid是JQuery的表格插件，功能非常強大，基本上能想到，它都能實現(xiàn)。下面是一個例子，希望能通過這個示例，能讓你了解下JqGrid。2011-05-05
這篇文章主要介紹了jQuery的context屬性用法,實例分析了context屬性返回節(jié)點內(nèi)容的使用技巧,具有一定的參考借鑒價值,需要的朋友可以參考下2014-12-12
下面小編就為大家?guī)硪黄猨query實現(xiàn)input框獲取焦點的方法。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-02-02
JQuery EasyUI 結(jié)合ztrIee的后臺頁面開發(fā)實例
下面小編就為大家?guī)硪黄狫Query EasyUI 結(jié)合ztrIee的后臺頁面開發(fā)實例。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-09-09