<!DOCTYPE html>
<HTML><HEAD>
<TITLE> test 3</TITLE> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <link rel="stylesheet" href="css/demo.css" type="text/css"> <link rel="stylesheet" href="css/zTreeStyle/zTreeStyle.css" type="text/css"> <script type="text/javascript" src="js/jquery-1.4.4.min.js"></script> <script type="text/javascript" src="js/jquery.ztree.core.js"></script> <script type="text/javascript" src="js/jquery.ztree.excheck.js"></script> <script type="text/javascript" src="js/jquery.ztree.exedit.js"></script> <SCRIPT type="text/javascript"> //树属性的定义 var setting = { view: {fontCss: getFont,
nameIsHTML: true }, data: { simpleData: { enable: true, idKey: "id", pIdKey: "pId", system: "system", rootPId: "" } }};
var zTreeNodes = [{ id: 1, pId: 0, name: "父节点1", iconClose: "./2.gif", iconOpen: "./3.gif" }, { id: 2, pId: 1, name: "子节点1", icon: "./1.gif", font: { 'font-weight': 'bold' } }, { id: 3, pId: 2, name: "子节点2", icon: "./1.gif", font: { 'font-style': 'italic' } }, { id: 4, pId: 2, name: "子节点1", icon: "./1.gif", font: { 'color': 'red' } }, { id: 5, pId: 2, name: "子节点2", icon: "./1.gif", font: { 'color': 'blue' } }, { id: 6, pId: 3, name: "子节点1", icon: "./1.gif", font: { 'font-style': 'italic' } }, { name: "<span>view</span>" }];
function getFont(treeId, node) {
return node.font ? node.font : {}; } $(document).ready(function() { zTreeObj = $.fn.zTree.init($("#tree"), setting, zTreeNodes);});
</SCRIPT> </HEAD><BODY>
<ul id="tree" class="ztree"></ul> </BODY></HTML>