在咱们坛子里能搜到不少联级下拉菜单的代码,但一直没有找到功能完全符合我的需要的,于是借鉴了一个叫做“HPMenu”的代码,重新进行了改进,并支持下列功能:
部分js代码:
var Linkage = Class.create();
Linkage.prototype = {
initialize : function(dataSrc, xmlFile) {
this.dataSrc = dataSrc;
this.xmlFile = xmlFile;
},
dataSrc : "" ,
xmlFile : "" ,
//初始化SELECT列表时的默认值
BLANK_SELECT : "-----请选择-----" ,
//三维数组 总的数据数组
AllMenuArr : new Array() ,
//二维数组 应用的表单(SELECT)元素数组
MenuIdArr : new Array() ,
//各分支数据级组
MenuInfoArr : new Array() ,
//遍历XML时,记录当前元素深度
iDepth : -1 ,
tree : function(dataSrc, Element) {
var node = "";
if(Element.nodeType != 3) {
node = Element;
this.onElement(dataSrc, Element);
}
if(Element.hasChildNodes) {
for(var i=0;i<Element.childNodes.length;i++) {
if (Element.childNodes[i].nodeType != 3) {
this.iDepth++;
this.tree(dataSrc, Element.childNodes[i]);
}
}
}
if(node) {
this.endElement();
}
} ,
onElement : function(dataSrc, ele) {
if ($V(ele, "Value") != null) {
if (this.MenuInfoArr[dataSrc] == null) {
this.MenuInfoArr[dataSrc] = new Array();
}
if (this.MenuInfoArr[dataSrc][this.iDepth] == null) {
this.MenuInfoArr[dataSrc][this.iDepth] = new Array();
}
this.MenuInfoArr[dataSrc][this.iDepth].push(new MenuInfo($V(ele.parentNode, "Value") , $V(ele, "Value") , ($V(ele, "Desc")==null ? $V(ele, "Value") : $V(ele, "Desc"))));
}
} ,
endElement : function() {
this.iDepth--;
} ,
//初始化空的SELECT
initBlank : function(element) {
element.length = 0;
element.options.add(new Option( this.BLANK_SELECT, "" ));
element.selectedIndex = 0;
} ,
//初始化下级以下菜单
updateAllLast : function(dataSrc, nLevel) {
for(i = nLevel+1; i < this.MenuIdArr[dataSrc].length; i++) {
childNode = $(this.MenuIdArr[dataSrc][i]);
this.initBlank(childNode);
childNode.disabled = true;
}
} ,
代码打包下载(14KB)
请稍等,评论加载中...