首页 >> 下载中心 >> JavaScript源码 >> 无限级JavaScript下拉列表菜单

无限级JavaScript下拉列表菜单

作者:zhangyanan2000 来源:蓝色理想 时间:2008-1-6 网友评论条 【

在咱们坛子里能搜到不少联级下拉菜单的代码,但一直没有找到功能完全符合我的需要的,于是借鉴了一个叫做“HPMenu”的代码,重新进行了改进,并支持下列功能:


  • 支持IE/FireFox/Opera
  • 绑定数据到XML
  • 支持外部XML文件或页面内XML数据岛
  • 支持一个页面中定义多组,互不干扰
  • 支持设定初始值
2006-07-20 16:10
按版主的建议进行了修正,现支持下列功能:

  • 支持Option的Value和Text分开设置(通过设置XML节点的Value及Desc属性,如果没有Desc属性,则默认为一致)
  • 封装成类
  • 可以设定默认值

查看演示页面

部分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)

站长工具
人民币金额大写查询:
相关文章
loading 请稍等,评论加载中...

学习Asp到中国Asp之家(Aspxhome.com)

闽ICP备06017341号