JS 创建 下拉列表

<select> 的子项 <option> 可以直接写死在 JSP 页面中，也可以通过 JS 来创建，当页面加载时填充；当遇到多级下拉列表有相互关联的时候，也就是说一个下拉列表选中某值，要求另外一个下拉列表加载不同值，这时候就需要创建 <option>。
举例：
  要求选择不同省份的一级下拉列表，另外一个二级下拉列表出现每个省份对应的城市。
代码:
----------------------------------------------------------------------------------------------
JSP:
<select id="province" name="province" onchange="setCityOption(this, 'city');">
</select>
<select id="city" name="city">
</select>
----------------------------------------------------------------------------------------------
JS:
(1) onload="init();"
init = function(){
  //页面加载来创建 province 的子项
  //数组第一位设为提交值 value, 第二位设为显示值 text
  var provinceList = new Array();
  provinceList[0] =  [1, '四川']；
  provinceList[1] =  [2, '山东']；
  provinceList[2] =  [3, '福建']；

  createSelectOption(provinceList, "province");
}

(2) 设置一个下拉列表的子项
createSelectOption = function(_array, _selectID){

  var p = document.getElementById(_selectID);
  //清空这个下拉列表值
  p.innerHTML = '';
  p.options.length = 0;
  //先创建一个“---请选择---”的子项
  var optionTemp = document.createElement('option');
  optionTemp.value = "0";
  //注意：显示值没有用 optionTemp.text = "---请选择---";因为在 IE（我用的IE7） 下无法显示，其他浏览器正常，暂时不知道为什么，只是这样处理。
  optionTemp.innerHTML = "---请选择---";
  p.appendChild(optionTemp);
  //数组循环加载子项 <option>
  for(var i = 0; i < _array.length; i ++)
{
  var option = document.createElement('option');
  option.value = _array[0];
  option.innerHTML = _array[1];
//  option.text = _array[1];
  p.appendChild(option);
}

}

(3)
setCityOption = function(_select, cityID){
//四川
var sc = new Array();
sc[0] = [1, '成都'];
sc[1] = [2, '自贡'];
sc[2] = [3, '攀枝花'];
sc[3] = [4, '泸州'];
sc[4] = [5, '德阳'];
sc[5] = [6, '绵阳'];
sc[6] = [7, '广元'];
sc[7] = [8, '遂宁'];
sc[8] = [9, '内江'];
sc[9] = [10, '乐山'];
sc[10] = [11, '南充'];
sc[11] = [12, '宜宾'];
sc[12] = [13, '广安'];
sc[13] = [14, '达州'];
sc[14] = [15, '眉山'];
sc[15] = [16, '雅安'];
sc[16] = [17, '巴中'];
sc[17] = [18, '资阳'];
sc[18] = [19, '阿坝'];
sc[19] = [20, '甘孜'];
sc[20] = [21, '凉山'];

//山东
var sd = new Array();
sd[0] = [1, '济南'];
sd[1] = [2, '青岛'];
sd[2] = [3, '淄博'];
sd[3] = [4, '枣庄'];
sd[4] = [5, '东营'];
sd[5] = [6, '烟台'];
sd[6] = [7, '潍坊'];
sd[7] = [8, '威海'];
sd[8] = [9, '济宁'];
sd[9] = [10, '泰安'];
sd[10] = [11, '日照'];
sd[11] = [12, '莱芜'];
sd[12] = [13, '临沂'];
sd[13] = [14, '德州'];
sd[14] = [15, '聊城'];
sd[15] = [16, '滨州'];
sd[16] = [17, '菏泽'];

//福建
var fj = new Array();
fj[0] = [1, '福州'];
fj[1] = [2, '厦门'];
fj[2] = [3, '莆田'];
fj[3] = [4, '三明'];
fj[4] = [5, '泉州'];
fj[5] = [6, '漳州'];
fj[6] = [7, '南平'];
fj[7] = [8, '龙岩'];
fj[8] = [9, '宁德'];

switch(_select.value)
{
   case '1':
    createSelectOption(sc, cityID);
    break;
   case '2':
    createSelectOption(sd, cityID);
    break;
   case '3':
    createSelectOption(fj, cityID);
    break;
   default:
    break;
  }
}