連動するセレクトボックスの内容を増やしたい

連動するセレクトボックスの内容を増やしたい

お世話になります。
現在JavaScriptで以下のサンプルのような連動セレクトボックスを作っているのですが、親と子のセレクト項目を増やすやり方がわからず困っています。
http://enjoyjob.blog116.fc2.com/blog-entry-221.html

サンプルでは親と子のセレクトボックスが３つなのですが、
７つの親と子のセレクトボックスを作りたいと思っています。

JavaScriptのどの部分を変えればいいのかどうかご教授お願いいたします。

<script type="text/javascript">
var parentArray = new Array('東京都','神奈川県','静岡県');
////親セレクトボックスを配列から書き出し
function autoOptions(){
var parent=parentArray.length;
var selectNumber = document.getElementsByTagName("select").length;

for(var j=0;j<=selectNumber/2-1;j++){
idName='parent_'+j;
document.getElementById(idName).length=parent+1;
for(var i=0;i<parent;i++){
document.getElementById(idName).options[i+1].text=
parentArray[i];
}
}

}
////連動セレクトボックス
function selectBox(n){
var idParent='parent_'+n;
var idChild='child_'+n;

if(document.getElementById(idParent).selectedIndex==0){
document.getElementById(idChild).length=1;
document.getElementById(idChild).selectedIndex=0;
}
else {
document.getElementById(idChild).selectedIndex=0;
document.getElementById(idChild).length=1;
var child =
childArray[document.getElementById(idParent).selectedIndex-1];
document.getElementById(idChild).length=child.length+1;
for(var i=0;i < child.length;i++){
document.getElementById(idChild).options[i+1].text= child[i];
}
}
}
////子セレクトボックスの配列
var childArray = new Array();
childArray[0]=new Array("渋谷区","品川区","港区","新宿区");
childArray[1]=new Array("横浜市","川崎市","厚木市","小田原市");
childArray[2]=new Array("静岡市","浜松市","三島市","焼津市","清水市");
</script>

投稿日時 - 2010-03-10 11:52:24