select下拉列表做二级的如何做？谢谢

Question

select下拉列表做二级的如何做？谢谢
效果像这样:
a
-----a1
-----a2
-----a3
b
-----b1
-----b2

Answer 1

<select>
<optgroup label="a" />
<option>a1</option>
<option>a2</option>
<option>a3</option>
<option>a4</option>
<optgroup label="b" />
<option>b1</option>
<option>b2</option>
<option>b3</option>
<option>b4</option>
</select>

Answer 2

<select> 
<optgroup label="a" /> 
<option>a1 </option> 
<option>a2 </option> 
<option>a3 </option> 
<option>a4 </option> 
<optgroup label="b" /> 
<option>b1 </option> 
<option>b2 </option> 
<option>b3 </option> 
<option>b4 </option> 
</select> 

Answer 3

function ClassSelect(){
this.Name = [];
this.Class = [];
this.ClassNum = 4;
}
ClassSelect.prototype.Run = function(){
var _Flag = -2;
var OptionSub = null;
var SelectedStr = "";
for(var i = 0;i < this.ClassNum; i++){
OptionSub = new Option();
OptionSub.text = "==请选择==";
OptionSub.value = "0$0";
$(this.Name[i]).add(OptionSub);
}
if(this.Class[0].length == 0){
$(this.Name[0]).options[0].selected = true;
}else{
for(var i = 0;i < this.Class[0].length; i++){
OptionSub  = new Option();
OptionSub.text = this.Class[0][i][0];
OptionSub.value = this.Class[0][i][1];
SelectedStr = this.Class[0][i][1];
SelectedStr = SelectedStr.substring(SelectedStr.lastIndexOf("$")+1,SelectedStr.length);
if(parseInt(SelectedStr) == 1){OptionSub.selected = true;_Flag = i;}
$(this.Name[0]).add(OptionSub);
}
if(_Flag == -2){
$(this.Name[0]).options[1].selected = true;
_Flag = 0;
}
this.CreateClassSub(1,_Flag.toString());
}
}
ClassSelect.prototype.CreateClassSub = function(Num,SelectedIdStr){
if(Num == this.ClassNum)return;
var _Flag = -2;
var OptionSub = null;
var SelectedStr = "";
var SelectedId = "";
var SelectedArr = SelectedIdStr.toString().split(",");
var ClassValue = "";
var ClassObject = new Object();
if(SelectedArr.length < Num){
SelectedId = -1;
}else{
SelectedId = parseInt(SelectedArr[Num - 1]);
}
for(var i = Num;i < this.ClassNum; i++){
$(this.Name[i]).length = 1;
}
if(parseInt(SelectedId) == -1){
for(var i = Num;i < this.ClassNum; i++){
$(this.Name[i]).options[0].selected = true;
$(this.Name[i]).style.display = "none";
}
}else{
ClassValue += "this.Class["+Num+"]";
for(var i = 0;i < SelectedArr.length; i++){
ClassValue += "["+ SelectedArr[i] +"]";
}
ClassObject = eval(ClassValue);
if(ClassObject.length == 0){
for(var i = Num;i < this.ClassNum; i++){
$(this.Name[i]).options[0].selected = true;
$(this.Name[i]).style.display = "none";
}
}else{
$(this.Name[Num]).style.display = "";
for(var i = 0;i < ClassObject.length; i++){
OptionSub = new Option();
OptionSub.text = ClassObject[i][0];
OptionSub.value = ClassObject[i][1];
SelectedStr = ClassObject[i][1];
SelectedStr = SelectedStr.substring(SelectedStr.lastIndexOf("$")+1,SelectedStr.length);
if(parseInt(SelectedStr) == 1){OptionSub.selected = true;_Flag = i;}
$(this.Name[Num]).add(OptionSub);
}
if(_Flag == -2){
$(this.Name[Num]).options[1].selected = true;
_Flag = 0;
}
this.CreateClassSub(Num+1,SelectedIdStr+","+_Flag);
}
}
}
ClassSelect.prototype.Argument = function(M){
var Str = "";
for(var i = 0;i < M; i++){
Str += ($(this.Name[i]).selectedIndex-1).toString() +",";
}
Str = Str.substring(0,Str.length - 1);
return Str;
}调用时是：
    var Class = null;
    var Class_One = <%=Arr[0] %>;
    var Class_Two = <%=Arr[1] %>;
    var Class_Three = <%=Arr[2] %>;
    var Class_Four = <%=Arr[3] %>;
    var Class_Five = <%=Arr[4] %>;
    var Class_Six = <%=Arr[5] %>;
    Class = new ClassSelect();
    Class.Name = ["ClassOne","ClassTwo","ClassThree","ClassFour","ClassFive","ClassSix"];
    Class.Class = [Class_One,Class_Two,Class_Three,Class_Four,Class_Five,Class_Six];
    Class.ClassNum = 6;
    Class.FirstOption = ""
    window.onload = function(){
            Class.Run();
    $("ClassOne").setAttribute("onchange",function(){
    Class.CreateClassSub(1,Class.Argument(1));
    });
    $("ClassTwo").setAttribute("onchange",function(){     
        Class.CreateClassSub(2,Class.Argument(2));
    });
    $("ClassThree").setAttribute("onchange",function(){
        Class.CreateClassSub(3,Class.Argument(3))
    });
    $("ClassFour").setAttribute("onchange",function(){
        Class.CreateClassSub(4,Class.Argument(4))
    });
    $("ClassFive").setAttribute("onchange",function(){
        Class.CreateClassSub(5,Class.Argument(5))
    });
     }
上边是js部分
<select name="ClassOne" id="ClassOne"></select>
<select name="ClassTwo" id="ClassTwo"></select>
<select name="ClassThree" id="ClassThree"></select>
<select name="ClassFour" id="ClassFour"></select>
<select name="ClassFive" id="ClassFive"></select>
<select name="ClassSix" id="ClassSix"></select>是这样作的 哈哈 不过 现在实现无限级下拉 有点麻烦  不过 以后有时间会升级的 现在这个也可以实现无限级 
类别数组格式 是 Class_One[]这样写出来的 然后后台 用服务器 写一个无限调出各级类型的 递归函数就行了 我不知道你用的是什么语言 我用的是 .net  有兴趣 可以找我 我发给你