JS组件--Tree
function MyTree(cnt) {this.imgPath = "images/treeimg/";this.setRoot(new Node(-1, "root", ""));cnt = document.getElementById(cnt);//cnt.style.width = 210;//cnt.style.height = 350;cnt.style.fontSize = "12px";//cnt.style.borderStyle = "solid";//cnt.style.borderColor = "#ccc";//cnt.style.borderWidth = "1px 1px 1px 1px";//cnt.style.overflowY = "scroll";this.container = cnt;}MyTree.prototype = {setRoot:function (root) {this.root = root;this.root.icon = this.imgPath + "base.gif";}, render:function () {this.root.render();this.container.appendChild(this.root.box);var ns = this.root.child;for (var k = 0; k < ns.length; k++) {ns.render();this.container.appendChild(ns.box);this.container.appendChild(ns.subbox);}}};function Node(id, text, href) {this.imgPath = "images/treeimg/";this.target = "cntFrm";this.child = [];this.id = id;this.text = text;this.icon = this.imgPath + "file.gif";this.href = href;this.leaf = true;this.last = true;this.parent = null;this.level = 0;this.box = document.createElement("div");this.subbox = document.createElement("div");this.state = 1;}Node.prototype = {render : function () {this.setIndent();this.setIcon();//this.setChk();this.setText();},add : function (id, text, icon, href) {var node = new Node(id, text, icon, href);this.leaf = false;this.icon = this.imgPath + "foldericon.gif";node.parent = this;if (node.parent.child.length != 0) {node.parent.child.last = false;}node.level = this.level + 1;this.child.push(node);return node;},getNoLineNum : function () {var count = 0;var p = this.parent;while (p && p.last) {count++;p = p.parent;}return count;},setIcon : function () {var icon = document.createElement("image");icon.setAttribute("align", "top");icon.src = this.icon;this.box.appendChild(icon);},setText : function () {var span = document.createElement("span");var text = document.createTextNode(this.text);if (this.leaf) {var href = this.href;span.attachEvent("onclick", function (e) {var sender = window.event.srcElement;Ajax(href, null, function(res){//var div = document.getElementById("mm");//mm.innerHTML = res.responseText;});});}span.appendChild(text);this.box.appendChild(span);},setChk : function () {var chk = document.createElement("input");chk.setAttribute("type", "checkbox");chk.style.margin = '0 0 0 0';this.box.appendChild(chk);},getPM : function () {var pm = "L1.gif";if (this.leaf) {pm = this.last ? "L1.gif" : "T1.gif";} else {if (this.state == 0) {if (this.last) {pm = "Lplus1.gif";} else {pm = "Tplus1.gif";}} else {if (this.last) {pm = "Lminus1.gif";} else {pm = "Tminus1.gif";}}}return pm;},setIndent : function () {var count = this.getNoLineNum();var indent = document.createElement("span");for (var i = 1; i <= this.level; i++) {var blank = document.createElement("span");blank.style.width = 18;if (i > 1 && i <= this.level - count) {blank.style.backgroundImage = "url(" + this.imgPath + "I1.gif)";}indent.appendChild(blank);}if (this.level > 0) {var t = document.createElement("image");t.setAttribute("align", "top");t.setAttribute("id", "img" + this.id);t.src = this.imgPath + this.getPM();var kk = this;var cs = kk.child;for (var k = 0; k < cs.length; k++) {cs.render();kk.subbox.appendChild(cs.box);kk.subbox.appendChild(cs.subbox);}kk.subbox.style.display = (this.state==0)?"none":"block";t.attachEvent("onclick", function (e) {var sender = window.event.srcElement;if (kk.state == 0) {kk.state = 1;sender.src = kk.imgPath + kk.getPM();kk.subbox.style.display = "block";} else {kk.state = 0;sender.src = kk.imgPath + kk.getPM();kk.subbox.style.display = "none";}});indent.appendChild(t);}this.box.appendChild(indent);}};
页:
[1]