tree.js

电信的网厅的整站代码

/***************************************************************************************
 *                               XMLTree2.1
 *     此代码版权归海洋工作室ocean所有，您可以非商业目的使用、复制、修改此代码，但需要
 * 保留本工作室的版权信息。如果您使用、修改此代码为商业目的，请联系本工作室取得使用许可。
 * 此脚本的商业许可为RMB30，被许可方除不能分发和转售之外，可以用于被许可方的任何项目和
 * 产品当中。
 * 如果您对本程序有什么建议，请email to:[e-mail]。
 *
 *                                                                          海洋工作室
 *                                                          http://www.oceanstudio.net
 *                                                     ocean([e-mail]) 制作
 *****************************************************************************************/ 

//XML树类
function XMLTree(treeName) {
	this.id = treeName;
	this.xmlDoc = null;
	this.dblClick = false;    // "true"为允许有双击事件，"false"为不允许有双击事件，默认为"false"
	this.openAction = false;  //展开节点时的行为,"true"为已展开的节点全部关闭，"false"为已展开的节点全部保持不变.

	this.isOpened = false;	//节点是否是展开的，false－没有展开
	this.isLoaded = false;	//节点是否是已经加载的。（针对ref型节点）
	this.isSelected = false;	//节点是否被选中

	this.ref = "";			//引用外部的xml路径
	this.autoRefresh = false;	//是否总是重新加载外部xml（false－不重新加载）

	this.text = "";	//节点的文字
	this.title = "";	//节点的提示

	this.textColor = "#000000";	//节点文字的颜色
	this.overTextColor = "#cccccc";	//节点鼠标放上去时候文字的颜色
	this.selectedTextColor = "red";	//节点被选中后的颜色

	this.backgroundColor = "";	//节点的背景色
	this.overBackgroundColor = "";	//节点鼠标放上去是的背景色
	this.selectedBackgroundColor = "#cccccc";	//节点被选中时候的背景色

	this.underLine = false;		//节点文字是否有下划线，false-没有下划线
	this.overUnderLine = true;	//节点鼠标放上去的时候文字是否有下划线，false-没有下划线
	this.selectedUnderLine = false;	//节点选中的时候文字是否有下划线

	this.fontSize = "9pt";			//文字大小

	this.paddingLeft = "18px";//左边缩进
	this.paddingTop = "2px";  //上边缩进
	this.spaceWidth = "2px";    //图片和图片以及文字与图片之间间距
	this.leafPaddingLeft = "18px";	//2.01：叶子左边多余缩进

	this.cursor = "hand";		//鼠标的默认形状

	this.openFlag = "images/openflag.gif";		//节点打开时的第一个图片（一般是-号）
	this.closeFlag = "images/closeflag.gif";	//节点关闭时的第一个图片（一般是+号）
	this.openFolder = "images/openfolder.gif";	//节点打开时的第二个图片（一般是一个文件夹的图片）
	this.closeFolder = "images/closedfolder.gif";	//节点关闭时的第二个图片（一般是一个文件夹的图片）
	this.leafImage = "images/url.gif";		//叶子节点的图片
	this.href = "";			//节点的url链接

	this.selectedNode = null;					//被选中的节点

	this.doc = null;		//节点的文档对象
	this.menuNode = new Array();		//节点数组：此节点的子菜单中的每一个节点
	this.parent = null;			//节点的父亲（为null的话表明这是一个树根）
	this.root = this;			//节点的根（为null的话表明这是一个树根）
	this.currentNode = null;	//当前正在使用的节点
}
//外部方法：异步xml读取数据，数据来自一个xml文件
XMLTree.prototype.load = function (url,container) {
	if (container != null)
		this.doc = container;
	this.xmlDoc = new ActiveXObject("Msxml.DOMDocument");
	this.root.currentNode = this;
	var f = new Function("event",this.root.id+".currentNode.parseTree()");
	this.xmlDoc.onreadystatechange = f;
	this.xmlDoc.load(url);
}
//展开一个节点的下一级子节点
XMLTree.prototype.open = function (nodeId) {
	var node = this.getMenuItem(nodeId);
	if (node == null) node = this;		//如果没有找到相应的节点，则以自身节点
	if (node.parent == null) return;		//如果节点是根结点，则返回
	var nodeType = node.getType();
	if (nodeType != "leaf") {		//叶子节点不去理会
		if (nodeType == "node")	{	//如果是一个包含字节点的节点
			node.doc.children[1].style.display = "block";
		}
		else {		//如果是引用节点
			if (node.isLoaded) {	//如果节点已经加载，则直接展开
				if (node.doc.children.length >= 2) {
					node.doc.children[1].style.display = "block";
				}
			}
			else {
				node.load(node.ref);		//加载子节点的树
				node.isLoaded = true;
			}
		}
		//标识节点为打开状态
		node.isOpened = true;
		node.doc.children[0].rows[0].cells[0].children[0].src = node.openFlag;
		node.doc.children[0].rows[0].cells[1].children[0].src = node.openFolder;
	}
}
//关闭一个节点的下一级子节点
XMLTree.prototype.close = function (nodeId) {
	var node = this.getMenuItem(nodeId);
	if (node == null) node = this;		//如果没有找到相应的节点，则以自身节点
	if (node.parent == null) return;		//如果节点是根结点，则返回
	var nodeType = node.getType();
	if (nodeType != "leaf") {		//叶子节点不去理会
		if (nodeType == "node")	{	//如果是一个包含字节点的节点
			if (node.doc.children.length >= 2) {
				node.doc.children[1].style.display = "none";
			}
		}
		else {		//如果是引用节点
			if (node.autoRefresh) {			//如果节点属于总是加载情况，则删除掉此节点的子节点
				node.doc.children[1].removeNode(true);
				node.menuNode = new Array();
				node.isLoaded = false;
			}
			else {
				if (node.doc.children.length >= 2) {
					node.doc.children[1].style.display = "none";
				}
			}
		}
		node.isOpened = false;
		node.doc.children[0].rows[0].cells[0].children[0].src = node.closeFlag;
		node.doc.children[0].rows[0].cells[1].children[0].src = node.closeFolder;
	}
}
//选中一个节点
XMLTree.prototype.selected = function (nodeId) {
	var node = this.getMenuItem(nodeId);
	if (node == null) node = this;		//如果没有找到相应的节点，则以自身节点
	if (node.parent == null) return;		//如果节点是根结点，则返回
	var oSpan = node.doc.children[0].cells[2].children[0];	//找到此节点相应的文字对象
	with (oSpan.style) {
		color = node.selectedTextColor;
		backgroundColor = node.selectedBackgroundColor;
		textDecoration = node.selectedUnderLine ? "underline" : "none";
	}
	node.isSelected = true;				//标识节点被选中
}
//取消选中的一个节点
XMLTree.prototype.unSelected = function (nodeId) {
	var node = this.getMenuItem(nodeId);
	if (node == null) node = this;		//如果没有找到相应的节点，则以自身节点
	if (node.parent == null) return;		//如果节点是根结点，则返回
	var oSpan = node.doc.children[0].cells[2].children[0];	//找到此节点相应的文字对象
	with (oSpan.style) {
		color = node.textColor;
		backgroundColor = node.backgroundColor;
		textDecoration = node.underLine ? "underline" : "none";
	}
	node.isSelected = false;				//标识节点被选中
}
//得到当前节点的类型，返回"leaf"、"node"、"ref"三种情况
XMLTree.prototype.getType = function () {
	if (this.ref != "") return "ref";
	if (this.menuNode.length > 0) return "node";
	return "leaf";
}
//根据菜单项id查找菜单项，返回拥有此id的菜单项
XMLTree.prototype.getMenuItem = function (id) {
	if (this.id == id) {		//如果此节点就是要寻找的节点
		return this;
	}
	else {
		for (var i=0;i<this.menuNode.length;i++) {
			var result = this.menuNode[i].getMenuItem(id);		//递归搜索子节点
			if (result != null)		//如果搜索到则返回此节点
				return result;
		}
		return null;		//如果搜索不到则返回null
	}
}
//2.01：根据菜单项href查找菜单项，返回拥有此href的菜单项
XMLTree.prototype.getMenuItemByHref = function (href) {
	if (this.href == href) {		//如果此节点就是要寻找的节点
		return this;
	}
	else {
		for (var i=0;i<this.menuNode.length;i++) {
			var result = this.menuNode[i].getMenuItemByHref(href);		//递归搜索子节点
			if (result != null)		//如果搜索到则返回此节点
				return result;
		}
		return null;		//如果搜索不到则返回null
	}
}
//解析xml树
XMLTree.prototype.parseTree = function () {
	var state = this.xmlDoc.readyState;
	if (state == 4)
	{
		var err = this.xmlDoc.parseError;
		if (err.errorCode != 0) {
			alert("菜单树加载失败");
			return false;
		}
		else {
			this.xmlDoc = this.xmlDoc.childNodes[1];
			this.initTree();
			this.attachTree();
			if (this.parent == null) {		//如果这是根的话，则附加事件
				var f = new Function("event",this.id+".doClick()");
				this.doc.attachEvent("onclick",f);
				f = new Function("event",this.id+".doDblClick()");
				this.doc.attachEvent("ondblclick",f);
				f = new Function("event",this.id+".doMouseOver()");
				this.doc.attachEvent("onmouseover",f);
				f = new Function("event",this.id+".doMouseOut()");
				this.doc.attachEvent("onmouseout",f);
			}
		}
	}
}
//初始化xml树
XMLTree.prototype.initTree = function () {
	if (this.xmlDoc == null) return;
	if (this.parent == null) {		//如果这是树根
		this.dblClick = (this.xmlDoc.getAttribute("dbl-click") == "true") ? true : false;
		this.openAction = (this.xmlDoc.getAttribute("open-action") == "true") ? true : false;
		//指定节点是否已经打开（此节点为根，这是取默认值）
		this.isOpened = false;
		//节点的样式和内容赋值（此节点为根，这是取默认值）
		this.autoRefresh = (this.xmlDoc.getAttribute("auto-refresh") == "true") ? true : false;
		this.textColor = (this.xmlDoc.getAttribute("text-color") == null) ? this.textColor : this.xmlDoc.getAttribute("text-color");
		this.overTextColor = (this.xmlDoc.getAttribute("over-text-color") == null) ? this.overTextColor : this.xmlDoc.getAttribute("over-text-color");
		this.selectedTextColor = (this.xmlDoc.getAttribute("selected-text-color") == null) ? this.selectedTextColor : this.xmlDoc.getAttribute("selected-text-color");
		this.backgroundColor = (this.xmlDoc.getAttribute("background-color") == null) ? this.backgroundColor : this.xmlDoc.getAttribute("background-color");
		this.overBackgroundColor = (this.xmlDoc.getAttribute("over-background-color") == null) ? this.overBackgroundColor : this.xmlDoc.getAttribute("over-background-color");
		this.selectedBackgroundColor = (this.xmlDoc.getAttribute("selected-background-color") == null) ? this.selectedBackgroundColor : this.xmlDoc.getAttribute("selected-background-color");
		this.underLine = (this.xmlDoc.getAttribute("under-line") == "true") ? true : false;
		this.overUnderLine = (this.xmlDoc.getAttribute("over-under-line") == "false") ? false : true;
		this.selectedUnderLine = (this.xmlDoc.getAttribute("selected-under-line") == "true") ? true : false;
		this.fontSize = (this.xmlDoc.getAttribute("font-size") == null) ? this.fontSize : this.xmlDoc.getAttribute("font-size");