xtree.js 代码


Posted in Javascript onMarch 13, 2007
//** Powered by Fason 
//** Email: fason_pfx@hotmail.com var icon={ 
    root    :'image/root.gif', 
    open    :'image/open.png', 
    close    :'image/close.png', 
    file    :'image/file.png', 
    Rplus    :'image/Rplus.gif', 
    Rminus    :'image/Rminus.gif', 
    join    :'image/T.gif', 
    joinbottom:'image/L.gif', 
    plus    :'image/Tplus.gif', 
    plusbottom:'image/Lplus.gif', 
    minus    :'image/Tminus.gif', 
    minusbottom:'image/Lminus.gif', 
    blank    :'image/blank.gif', 
    line    :'image/I.gif' 
}; 
var Global={ 
    id:0, 
    getId:function(){return this.id++;}, 
    all:[], 
    selectedItem:null, 
    defaultText:"treeItem", 
    defaultAction:"javascript:void(0)", 
    defaultTarget:"_blank" 
} 
function preLoadImage(){ 
    for(i in icon){ 
        var tem=icon[i]; 
        icon[i]=new Image() 
        icon[i].src=tem 
    } 
};preLoadImage(); 
function treeItem(text,action,target,title,Icon) 
{ 
    this.id=Global.getId(); 
    this.level=0; 
    this.text=text?text:Global.defaultText; 
    this.action=action?action:Global.defaultAction; 
    this.target=target?target:Global.defaultTarget; 
    this.title=title?title:this.text; 
    this.isLast=true; 
    this.childNodes=new Array(); 
    this.indent=new Array(); 
    this.parent=null; 
    var c =0;  
    if(getCookie("item"+this.id) != null) c = getCookie("item"+this.id); 
    this.open=parseInt(c); 
    this.load=false; 
    this.setuped=false; 
    this.JsItem=null; 
    this.container=document.createElement("div"); 
    this.icon=Icon; 
    Global.all[Global.all.length]=this; 
} 
treeItem.prototype.toString = function() 
{ 
    var o = this; 
    var oItem = document.createElement("div"); 
    oItem.id = "treeItem"+this.id 
    oItem.className = "treeItem"; 
    oItem.noWrap = true; 
    oItem.onselectstart = function(){ return false;} 
    oItem.oncontextmenu = function(){ return false;} 
    this.JsItem = oItem; 
    this.drawIndents(); 
    var iIcon = document.createElement("img"); 
    iIcon.align = "absmiddle"; 
    iIcon.src = this.childNodes.length>0?(this.open?(this.level>0?(this.isLast?icon.minusbottom.src:icon.minus.src):icon.Rminus.src):(this.level>0?(this.isLast?icon.plusbottom.src:icon.plus.src):icon.Rplus.src)):(this.level>0?(this.isLast?icon.joinbottom.src:icon.join.src):icon.blank.src); 
    iIcon.id = "treeItem-icon-handle-" + this.id; 
    iIcon.onclick = function(){ o.toggle();}; 
    oItem.appendChild(iIcon); 
    var iIcon = document.createElement("img"); 
    iIcon.align = "absmiddle"; 
    iIcon.src = this.icon?this.icon:(this.childNodes.length>0?(this.open?icon.open.src:icon.close.src):icon.file.src); 
    iIcon.id = "treeItem-icon-folder-" + this.id; 
    iIcon.onclick = function(){ o.select();}; 
    iIcon.ondblclick = function(){ o.toggle();}; 
    oItem.appendChild(iIcon); 
    var eText = document.createElement("span"); 
    var eA=document.createElement("a"); 
    eA.innerHTML = this.text; 
    eA.target = this.target; 
    eA.href = this.action; 
    eA.onkeydown = function(e){ return o.KeyDown(e);} 
    if(this.action == Global.defaultAction) eA.onclick = function(){ o.toggle(); return false;} 
    eText.appendChild(eA); 
    eText.id = "treeItem-text-" + this.id; 
    eText.className = "treeItem-unselect" 
    eText.onclick = function(){ o.select(1);}; 
    eText.title = this.title; 
    oItem.appendChild(eText); 
    this.container.id = "treeItem-container-"+this.id; 
    this.container.style.display = this.open?"":"none"; 
    oItem.appendChild(this.container); 
    return oItem; 
} 
treeItem.prototype.root = function() 
{ 
    var p = this; 
    while(p.parent) 
        p = p.parent; 
    return p; 
} 
treeItem.prototype.setText = function(sText) 
{ 
    if(this.root().setuped) 
    { 
        var oItem = document.getElementById("treeItem-text-" + this.id); 
        oItem.firstChild.innerHTML = sText; 
    } 
    this.text = sText; 
} 
treeItem.prototype.setIndent = function(l,v) 
{ 
    for(var i=0;i<this.childNodes.length;i++) 
    { 
        this.childNodes[i].indent[l] = v; 
        this.childNodes[i].setIndent(l,v); 
    } 
} 
treeItem.prototype.drawIndents = function() 
{ 
    var oItem = this.JsItem; 
    for(var i=0;i<this.indent.length;i++){ 
        var iIcon = document.createElement("img"); 
        iIcon.align = "absmiddle"; 
        iIcon.id = "treeItem-icon-" + this.id + "-" + i; 
        iIcon.src = this.indent[i]?icon.blank.src:icon.line.src; 
        oItem.appendChild(iIcon); 
    } 
} 
treeItem.prototype.add = function(oItem) 
{ 
    oItem.parent=this; 
    this.childNodes[this.childNodes.length]=oItem; 
    oItem.level=this.level+1; 
    oItem.indent=this.indent.concat(); 
    oItem.indent[oItem.indent.length]=this.isLast; 
    if(this.childNodes.length>1){ 
        var o=this.childNodes[this.childNodes.length-2]; 
        o.isLast=false; 
        o.setIndent(o.level,0); 
        if(this.root().setuped)o.reload(1); 
    } 
    else if(this.root().setuped) 
        this.reload(0); 
    this.container.appendChild(oItem.toString()); 
    this.container.style.display=this.open?"":"none"; 
} 
treeItem.prototype.loadChildren = function() 
{ 
    //do something 
} 
treeItem.prototype.remove = function() 
{ 
    var tmp = this.getPreviousSibling(); 
    //if(tmp){ tmp.select();} 
    this.removeChildren(); 
    var p = this.parent; 
    if(!p){ return }; 
    if(p.childNodes.length>0){ 
        var o = p.childNodes[p.childNodes.length-1]; 
        o.isLast = true; 
        o.setIndent(o.level,1); 
        if(o.root().setuped)o.reload(1); 
    } 
    else 
        p.reload(); 
} 
treeItem.prototype.removeChildren = function () 
{ 
    if(this == Global.selectedItem){ Global.selectedItem = null;} 
    for(var i=this.childNodes.length-1;i>=0;i--) 
        this.childNodes[i].removeChildren(); 
    var o = this; 
    var p = this.parent; 
    if (p) { p.childNodes = p.childNodes._remove(o);} 
    Global.all[this.id] = null 
    var oItem = document.getElementById("treeItem"+this.id); 
    if (oItem) { oItem.parentNode.removeChild(oItem); } 
} 
treeItem.prototype.reload = function(flag) 
{ 
    if (flag){ 
        for(var j=0;j<this.childNodes.length;j++){ this.childNodes[j].reload(1);} 
        for(var i=0;i<this.indent.length;i++) 
            document.getElementById("treeItem-icon-" +this.id+ "-"+i).src = this.indent[i]?icon.blank.src:icon.line.src; 
    } 
    document.getElementById("treeItem-icon-handle-" +this.id).src = this.childNodes.length>0?(this.open?(this.level>0?(this.isLast?icon.minusbottom.src:icon.minus.src):icon.Rminus.src):(this.level>0?(this.isLast?icon.plusbottom.src:icon.plus.src):icon.Rplus.src)):(this.level>0?(this.isLast?icon.joinbottom.src:icon.join.src):icon.blank.src); 
    if (!this.icon) 
        document.getElementById("treeItem-icon-folder-"+this.id).src = this.childNodes.length>0?(this.open?icon.open.src:icon.close.src):icon.file.src; 
} 
treeItem.prototype.toggle = function() 
{ 
    if(this.childNodes.length>0){ 
        if(this.open) 
            this.collapse(); 
        else 
            this.expand(); 
    } 
} 
treeItem.prototype.expand = function() 
{ 
    this.open=1; 
    setCookie("item"+this.id,1); 
    if(!this.load){ 
        this.load=true; 
        this.loadChildren(); 
        this.reload(1); 
    } 
    else  
        this.reload(0); 
    this.container.style.display = ""; 
} 
treeItem.prototype.collapse = function() 
{ 
    this.open=0; 
    setCookie("item"+this.id,0); 
    this.container.style.display = "none"; 
    this.reload(0); 
    this.select(1); 
} 
treeItem.prototype.expandAll = function() 
{ 
    if(this.childNodes.length>0 && !this.open)this.expand(); 
    this.expandChildren(); 
} 
treeItem.prototype.collapseAll = function() 
{ 
    this.collapseChildren(); 
    if(this.childNodes.length>0 && this.open)this.collapse(); 
} 
treeItem.prototype.expandChildren = function() 
{ 
    for(var i=0;i<this.childNodes.length;i++) 
    this.childNodes[i].expandAll(); 
} 
treeItem.prototype.collapseChildren = function() 
{ 
    for(var i=0;i<this.childNodes.length;i++) 
    this.childNodes[i].collapseAll() 
} 
treeItem.prototype.openURL=function() 
{ 
    if(this.action!=Global.defaultAction){ 
        window.open(this.action,this.target); 
    } 
} 
treeItem.prototype.select=function(o) 
{ 
    if (Global.selectedItem) Global.selectedItem.unselect(); 
    var oItem = document.getElementById("treeItem-text-" + this.id); 
    oItem.className = "treeItem-selected"; 
    oItem.firstChild.focus(); 
    Global.selectedItem = this; 
    if(!o) this.openURL(); 
} 
treeItem.prototype.unselect=function() 
{ 
    var oItem = document.getElementById("treeItem-text-" + this.id); 
    oItem.className = "treeItem-unselect"; 
    oItem.firstChild.blur(); 
    Global.selectedItem = null; 
} 
treeItem.prototype.setup = function(oTaget) 
{ 
    oTaget.appendChild(this.toString()); 
    this.setuped = true; 
    if(this.childNodes.length>0 || this.open) this.expand(); 
} 
/**********************************************/ 
/* 
    Arrow Key Event 
*/ 
/**********************************************/ 
treeItem.prototype.getFirstChild = function() 
{ 
    if(this.childNodes.length>0 && this.open) 
        return this.childNodes[0]; 
    return this; 
} 
treeItem.prototype.getLastChild = function() 
{ 
    if(this.childNodes.length>0 && this.open) 
        return this.childNodes[this.childNodes.length-1].getLastChild(); 
    return this; 
} 
treeItem.prototype.getPreviousSibling = function() 
{ 
    if(!this.parent) return null; 
    for(var i=0;i<this.parent.childNodes.length;i++) 
        if(this.parent.childNodes[i] == this)break; 
    if(i == 0)  
        return this.parent; 
    else 
        return this.parent.childNodes[i-1].getLastChild(); 
} 
treeItem.prototype.getNextSibling = function() 
{ 
    if(!this.parent) return null; 
    for(var i=0;i<this.parent.childNodes.length;i++) 
        if(this.parent.childNodes[i] == this)break; 
    if(i == this.parent.childNodes.length-1) 
        return this.parent.getNextSibling(); 
    else 
        return this.parent.childNodes[i+1]; 
} 
treeItem.prototype.KeyDown=function(e){ 
    var code,o; 
    if(!e) e = window.event; 
    code = e.which ? e.which : e.keyCode; 
    o = this; 
    if(code == 37) 
    { 
        if(o.open) o.collapse(); 
        else 
        { 
            if(o.parent) o.parent.select(); 
        } 
        return false; 
    } 
    else if(code == 38) 
    { 
        var tmp = o.getPreviousSibling(); 
        if(tmp) tmp.select(); 
        return false; 
    } 
    else if(code == 39) 
    { 
        if(o.childNodes.length>0) 
        { 
            if(!o.open) o.expand(); 
            else 
            { 
                var tmp = o.getFirstChild(); 
                if(tmp) tmp.select(); 
            } 
        } 
        return false; 
    } 
    else if(code == 40) 
    { 
        if(o.open&&o.childNodes.length>0)o.getFirstChild().select(); 
        else 
        { 
            var tmp = o.getNextSibling(); 
            if(tmp) tmp.select(); 
        } 
        return false; 
    } 
    else if(code == 13) 
    { 
        o.toggle(); 
        o.openURL(); 
        return false; 
    } 
    return true; 
} 
/*****************************************************/ 
Array.prototype.indexOf=function(o){ 
    for(var i=0;i<this.length;i++) 
        if(this[i]==o)return i; 
    return -1; 
} 
Array.prototype.removeAt=function(i){ 
    return this.slice(0,i).concat(this.slice(i+1)) 
} 
Array.prototype._remove=function(o){ 
    var i=this.indexOf(o); 
    if(i!= -1) return this.removeAt(i) 
    return this 
} 
/*****************************************************/ 
/*****************************************************/ 
/* 
    xtreeItem Class 
*/ 
/*****************************************************/ 
function xtreeItem(uid,text,action,target,title,Icon,xml){ 
    this.uid=uid; 
    this.base=treeItem; 
    this.base(text,action,target,title,Icon); 
    this.Xml=xml; 
} 
xtreeItem.prototype=new treeItem; 
xtreeItem.prototype.parseElement=function(dom){ 
    return dom.selectSingleNode("/TreeNode"); 
} 
xtreeItem.prototype.addNodesLoop = function(oItem) 
{ 
    for(var i=0;i<oItem.childNodes.length;i++) 
    { 
        var o = oItem.childNodes[i]; 
        var tmp = new xtreeItem(o.getAttribute("id"),o.getAttribute("text"),o.getAttribute("href"),o.getAttribute("target"),o.getAttribute("title"),o.getAttribute("icon"),o.getAttribute('Xml')); 
        this.add(tmp); 
        if(o.getAttribute("Xml")) tmp.add(new treeItem("Loading...")); 
        else 
        { 
            tmp.load=true; 
            tmp.addNodesLoop(o); 
        } 
    } 
} 
xtreeItem.prototype.loadChildren=function() 
{ 
    var oItem = this; 
    var oLoad = oItem.childNodes[0]; 
    var XmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); 
    XmlHttp.onreadystatechange=function(){ 
        if(XmlHttp.readyState==4){ 
            if(XmlHttp.status==200){ 
                if(XmlHttp.responseXML.xml == ""){ oLoad.setText("unavaible1");return;} 
                var XmlItem=oItem.parseElement(XmlHttp.responseXML.documentElement); 
                if(XmlItem.childNodes.length == 0){ oLoad.setText("unavaible") } 
                else 
                { 
                    oItem.addNodesLoop(XmlItem); 
                    for(var i=0;i<oItem.childNodes.length;i++) 
                    { 
                        if(parseInt(getCookie("item"+oItem.childNodes[i].id)) ==1) 
                        { oItem.childNodes[i].expand();} 
                    } 
                    if(Global.selectedItem == oItem.childNodes[0])oItem.select(); 
                    oLoad.remove(); 
                } 
            } 
            else{ 
                oLoad.setText("unavaible"); 
            } 
            XmlHttp = null; 
            oItem.select(1); 
        } 
    } 
    try{ 
        XmlHttp.open("get",this.Xml+(/\?/g.test(this.Xml)?"&":"?")+"temp="+Math.random(),true); 
        XmlHttp.send(); 
    }catch(e){ oLoad.setText("unavaible");} 
} 
xtreeItem.prototype.setup=function(oTarget){ 
    this.add(new treeItem("Loading...")); 
    oTarget.appendChild(this.toString()); 
    this.setuped=true; 
    if(this.childNodes.length>0 || this.open) this.expand(); 
} 
/*****************************************************/ 
function setCookie(name,value) 
{ 
    var Days = 7;  
    var exp  = new Date(); 
    exp.setTime(exp.getTime() + Days*24*60*60*1000); 
    document.cookie = name + "="+ escape (value) + ";expires=" + exp.toGMTString(); 
} 
function getCookie(name) 
{ 
    var arr = document.cookie.match(new RegExp("(^| )"+name+"=([^;]*)(;|$)")); 
    if(arr != null) return unescape(arr[2]); return null; 
} 
function delCookie(name) 
{ 
    var exp = new Date(); 
    exp.setTime(exp.getTime() - 1); 
    var cval=getCookie(name); 
    if(cval!=null) document.cookie= name + "="+cval+";expires="+exp.toGMTString(); 
}
Javascript 相关文章推荐
jquery乱码与contentType属性设置问题解决方案
Jan 07 Javascript
javascript中动态加载js文件多种解决办法总结
Nov 15 Javascript
AngularJS入门教程之表格实例详解
Jul 27 Javascript
js 作用域和变量详解
Feb 16 Javascript
js调用刷新界面的几种方式
May 03 Javascript
Javascript ES6中对象类型Sets的介绍与使用详解
Jul 17 Javascript
浅谈vue中使用图片懒加载vue-lazyload插件详细指南
Oct 23 Javascript
React BootStrap用户体验框架快速上手
Mar 06 Javascript
vue实现父子组件之间的通信以及兄弟组件的通信功能示例
Jan 29 Javascript
JS实现查找数组中对象的属性值是否存在示例
May 24 Javascript
详解Node.js异步处理的各种写法
Jun 09 Javascript
用js限制网页只在微信浏览器中打开(或者只能手机端访问)
Dec 24 Javascript
js资料prototype 属性
Mar 13 #Javascript
js资料toString 方法
Mar 13 #Javascript
pjblog修改技巧汇总
Mar 12 #Javascript
解决 firefox 不支持 document.all的方法
Mar 12 #Javascript
收藏一些不常用,但是有用的代码
Mar 12 #Javascript
图片自动缩小的js代码,用以防止图片撑破页面
Mar 12 #Javascript
[原创]js与自动伸缩图片 自动缩小图片的多浏览器兼容的方法总结
Mar 12 #Javascript
You might like
php实现图形显示Ip地址的代码及注释
2014/01/20 PHP
header导出Excel应用示例
2014/01/24 PHP
php使用curl和正则表达式抓取网页数据示例
2014/04/13 PHP
CodeIgniter开发实现支付宝接口调用的方法示例
2016/11/14 PHP
PHP中用Trait封装单例模式的实现
2019/12/18 PHP
javascript的对话框详解与参数
2007/03/08 Javascript
js 纯数字不重复排列的另类方法
2010/07/17 Javascript
idTabs基于JQuery的根据URL参数选择Tab插件
2012/04/11 Javascript
调试Javascript代码(浏览器F12及VS中debugger关键字)
2013/01/25 Javascript
原生JS实现加入收藏夹的代码
2013/10/24 Javascript
jquery改变tr背景色的示例代码
2013/12/28 Javascript
JavaScript中数组的合并以及排序实现示例
2015/10/24 Javascript
NodeJS收发GET和POST请求的示例代码
2017/08/25 NodeJs
详解angular应用容器化部署
2018/08/14 Javascript
小程序click-scroll组件设计
2019/06/18 Javascript
在vue项目中利用popstate处理页面返回的操作介绍
2020/08/06 Javascript
详解Python中的文件操作
2016/08/28 Python
Python 查找字符在字符串中的位置实例
2018/05/02 Python
windows下python和pip安装教程
2018/05/25 Python
python 定义给定初值或长度的list方法
2018/06/23 Python
对Tensorflow中的变量初始化函数详解
2018/07/27 Python
Pyorch之numpy与torch之间相互转换方式
2019/12/31 Python
CSS代码检查工具stylelint的使用方法详解
2021/03/27 HTML / CSS
后勤园长自我鉴定
2013/10/17 职场文书
医学生职业规划范文
2014/01/05 职场文书
告诉你怎样写创业计划书
2014/01/27 职场文书
工作说明书范文
2014/05/07 职场文书
2015年初中元旦晚会活动总结
2014/11/28 职场文书
2015年前台文员工作总结
2015/05/18 职场文书
学生退学证明
2015/06/23 职场文书
校园广播稿范文
2015/08/19 职场文书
《蚂蚁和蝈蝈》教学反思
2016/02/22 职场文书
Python爬虫之爬取最新更新的小说网站
2021/05/06 Python
分享Python获取本机IP地址的几种方法
2022/03/17 Python
关于pytest结合csv模块实现csv格式的数据驱动问题
2022/05/30 Python
Python实现信息管理系统
2022/06/05 Python