JS分级下拉列表框

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
</HEAD>

<BODY>
<!--
<SELECT id="selClass">
<option>╋BBCC</option>
<option>&nbsp;&nbsp;┠BBCC</option>
<option>&nbsp;&nbsp;&nbsp;&nbsp;┗BBCC</option>
<option>&nbsp;&nbsp;┠BBCC</option>
<option>&nbsp;&nbsp;┠BBCC</option>
<option>&nbsp;&nbsp;┗BBCC</option>
<option>╋BBCC</option>
<option>╋BBCC</option>
<option>╋BBCC</option>
<option>╋BBCC</option>
<option>&nbsp;&nbsp;┠BBCC</option>
<option>&nbsp;&nbsp;┠BBCC</option>
<option>&nbsp;&nbsp;┠BBCC</option>
<option>&nbsp;&nbsp;&nbsp;&nbsp;┗BBCC</option>
<option>&nbsp;&nbsp;┗BBCC</option>
<option>&nbsp;&nbsp;&nbsp;&nbsp;┗BBCC</option>
<option>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;┗BBCC</option>
</SELECT>
-->
<!--
分级下拉列表框,无需使用xml包
-->

<xml classid="1" parentid="" version='cn'>机械</xml>
<xml classid="2" parentid="" version='cn'>电子</xml>
<xml classid="3" parentid="" version='cn'>五金</xml>
<xml classid="4" parentid="2" version='cn'>电子====</xml>
<xml classid="5" parentid="3" version='cn'>五金====</xml>
<xml classid="6" parentid="5" version='cn'>五金====</xml>
<xml classid="7" parentid="5" version='cn'>五金====</xml>
<xml classid="8" parentid="5" version='cn'>五金====</xml>
<xml classid="9" parentid="4" version='cn'>五金====</xml>
<xml classid="10" parentid="3" version='cn'>五金====</xml>
<SCRIPT LANGUAGE="JavaScript">
//##################################################################################
function Stack(){
 this.__DataItem=new Array;
 this.length=0;
 this.__StackPointer=-1;
}
Stack.prototype.Push=function (data){
 this.length++;
 this.__StackPointer++;
 this.__DataItem[this.__StackPointer]=data;
}
Stack.prototype.Pop=function (){
 if(this.length<=0) return null;
 if(this.__StackPointer<=-1) return null;
 this.length--;
 this.__StackPointer--;
 return this.__DataItem[this.__StackPointer+1];
}
Stack.prototype.toString=function (){
 try{var chr=arguments[0]}catch(e){var chr=''}finally{
  if(typeof(chr)!='string') chr='';}
 if(this.length<=0) return "";
 var retStr="";
 for(var iCnt=0;iCnt<this.length;iCnt++)
  retStr+=this.__DataItem[iCnt]+chr;
 return retStr;
}
Stack.prototype.Item=function (ind){
 if(ind<0) return null;
 if(ind>this.__StackPointer) return null;
 return this.__DataItem[ind];
}
Stack.prototype.Top=function(){
 if(this.__StackPointer<0) return null;
 return this.__DataItem[this.__StackPointer];
}

</SCRIPT>
<SCRIPT LANGUAGE="JavaScript">
<!--
//var oData = document.getElementsByTagName('xml');

function DrawSelector(selName,fnOnChange)
{
 var gStack=new Stack();
 function BuildTree(object,iGrade,bolCont)
 {
  var fla = hasChildItem(object);

  document.write ('<option value="'+object.classid+'">');
  document.write (gStack.toString());
  document.write (object.innerHTML+' </option>');

  var oNodeTemp = getChildren(object);
  if(fla){
   if(iGrade>0) {gStack.Pop(); if(bolCont) gStack.Push('│'); else gStack.Push(' ');}
   gStack.Push('&nbsp;');
   for(var iCnt=0;iCnt<oNodeTemp.length;iCnt++){
    if(iCnt==oNodeTemp.length-1){
     gStack.Push('└');
     BuildTree(oNodeTemp[iCnt],iGrade+1,false);
     gStack.Pop();
    }else{
     gStack.Push('├');
     BuildTree(oNodeTemp[iCnt],iGrade+1,true);
     gStack.Pop();
    }
   }
   gStack.Pop();
  }
 }
 /////////////////////////////////////////////////////////////////////////////
 if(fnOnChange)
  document.write ('<select name="'+selName+'" onchange="'+fnOnChange+'">');
 else
  document.write ('<select name="'+selName+'">');
 document.write('<option value="">===所有===</option>');

 var oData = getTopLevelItems(); //所有父级为空的节点
 for(var iCnt=0;iCnt<oData.length;iCnt++){
  if(iCnt==oData.length-1){
   BuildTree(oData[iCnt],0,false);
  }else{
   BuildTree(oData[iCnt],0,true);
  }
 }
 document.write ('</select>');
}

function hasChildItem(object)
{
 if(object == null)
  return false;

 var hasChild = false;
 var oData = getAllItems();
 if(oData != null)
 {
  for(var i=0;i<oData.length;i++)
  {
   if(oData[i].parentid == object.classid)
    hasChild = true;
  }
 }
 return hasChild;
}

function getChildren(object)
{
 if(object != null)
 {
  var children = new Array();
  var oData = getAllItems();
  for(var i=0;i<oData.length;i++)
  {
   if(object.classid == oData[i].parentid)
    children.push(oData[i]);
  }
  return children;
 }
 else
 {
  return null;
 }
}

function getTopLevelItems()
{
 var obj = new Array();
 var oData = getAllItems();
 for(var i=0;i<oData.length;i++)
 {
  if(oData[i].parentid == '')
   obj.push(oData[i]);
 }
 return obj;
}

function getAllItems()
{
 var oData = document.getElementsByTagName('xml');
 return oData;
}
DrawSelector('selDepart','window.alert(this.value)');

//-->
</SCRIPT>
</BODY>
</HTML>
原文地址:https://www.cnblogs.com/yuanxiaoping_21cn_com/p/1574857.html