在下拉列表框中显示分级的菜单，在很多网站都可以看到的效果，很实用，下拉列表框中的选项是利用JS控制输出，如果你有更好的办法不用JS来显示，那最好了，因为像这种菜单用JS来实现，多多少少有点麻烦
在下拉列表中显示的多级树形菜单
var data =new Array();
data[0]= {id:'0',pid:'1',text:'河北'};
data[1]= {id:'1',pid:'-1',text:'中国'};
data[2]= {id:'2',pid:'6',text:'莫斯科'};
data[3]= {id:'3',pid:'0',text:'河南'};
data[4]= {id:'4',pid:'0',text:'北京'};
data[5]= {id:'5',pid:'3',text:'湖南'};
data[6]= {id:'6',pid:'-1',text:'俄罗斯'};
function TreeSelector(item,data,rootId){
this._data = data;
this._item = item;
this._rootId = rootId;
}
TreeSelector.prototype.createTree = function(){
var len =this._data.length;
for( var i= 0;i
if ( this._data[i].pid == this._rootId){
this._item.options.add(new Option(".."+this._data[i].text,this._data[i].id));
for(var j=0;j
this.createSubOption(len,this._data[i],this._data[j]);
}
}
}
}
TreeSelector.prototype.createSubOption = function(len,current,next){
var blank = "..";
if ( next.pid == current.id){
intLevel =0;
var intlvl =this.getLevel(this._data,this._rootId,current);
for(a=0;a
blank += "..";
blank += "├-";
this._item.options.add(new Option(blank + next.text,next.id));
for(var j=0;j
this.createSubOption(len,next,this._data[j]);
}
}
}
TreeSelector.prototype.getLevel = function(datasources,topId,currentitem){
var pid =currentitem.pid;
if( pid !=topId)
{
for(var i =0 ;i
{
if( datasources[i].id == pid)
{
intLevel ++;
this.getLevel(datasources,topId,datasources[i]);
}
}
}
return intLevel;
}
var ts = new TreeSelector(document.getElementById("myselect"),data,-1);
ts.createTree();
