<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>贵美购物车页面</title> <style type="text/css">
 .buyleft{
 width:150px;
 height:30px;
 text-align:right;
 font-size:14px;
 }
 </style>
 <script type="text/javascript">
var cityList = new Array();
     cityList['北京市'] = ['朝阳区','东城区'];
  cityList['玉林'] = ['容县','藤县']; 
 function change(){
     var province=document.getElementById("province").value; 
 var city=document.getElementById("city");
 city.options.length=0; //清除当前city中的选项
for (var i in cityList){
        if (i == province){
                for (var j in cityList[i]){
city.add(new Option(cityList[i][j],cityList[i][j]),null);
                }
            }
       }
  } 
  function allCity(){
  var provi=document.getElementById("province");
  var value1=document.getElementById("province").value;
  
  for(var i in value1){
  if(i==value1){
  for(var j in value[i]){
  provi.add(new Option(i,j),null);
 //这里的函数有误,请高手指点,实现地址选择的级联郊果
  }
  }
  }
 
  }
  
    window.onload=allCity();
</script>
</head><body> 
  <table width="100%" border="0" cellspacing="0" cellpadding="0">
   <form action="" method="post" name="myform">
      <tr>
        <td class="buyleft">地址: </td>
        <td><select  id="province" onchange="change( )" style="width:100px">
        <option>--选择省份--</option>
      </select>
      <select  id="city"  style="width:100px">
             <option>--选择市/区--</option>
             </select>
   </td>
      </tr>      
     
     </form>
</table>
</body>
</html>

解决方案 »

  1.   

      provi.add(new Option(i,j),null);
    这里改成appendChild的方式来添加看看也可以看看这个
    http://xxling.com/blog/article/73.aspx源码很简单 可以看一下
      

  2.   

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title>贵美购物车页面</title> <style type="text/css">
     .buyleft{
     width:150px;
     height:30px;
     text-align:right;
     font-size:14px;
     }
     </style>
     <script type="text/javascript">
         var cityList = new Array();
         cityList['北京市'] = ['朝阳区', '东城区'];
         cityList['玉林'] = ['容县', '藤县'];
         function change() {
             var province = document.getElementById("province").value;
             var city = document.getElementById("city");
             var arr = cityList[province];
             city.options.length = 0; //清除当前city中的选项
             for (var i = 0; i < arr.length; i++) city.options.add(new Option(arr[i], arr[i]));
             /*for (var i in cityList) {
                 if (i == province) {
                     for (var j in cityList[i]) {
                         city.add(new Option(cityList[i][j], cityList[i][j]), null);
                     }
                 }
             }*/
         }
         function allCity() {
             var provi = document.getElementById("province");
             var value1 = document.getElementById("province").value;
             for (attr in cityList) provi.options.add(new Option(attr, attr));
             /*for (var i in value1) {
                 if (i == value1) {
                     for (var j in value[i]) {
                         provi.options.add(new Option(i, j), null);///////
                         //这里的函数有误,请高手指点,实现地址选择的级联郊果
                     }
                 }
             }*/     }     window.onload = allCity////////();
    </script>
    </head><body> 
      <table width="100%" border="0" cellspacing="0" cellpadding="0">
       <form action="" method="post" name="myform">
          <tr>
            <td class="buyleft">地址: </td>
            <td><select  id="province" onchange="change( )" style="width:100px">
            <option>--选择省份--</option>
          </select>
          <select  id="city"  style="width:100px">
                 <option>--选择市/区--</option>
                 </select>
       </td>
          </tr>      
         
         </form>
    </table>
    </body>
    </html>