需要javascript动态级联选择选项的简明实现

以下程序可以在Windows 7中的Chrome，Firefox，Safari上运行，但无法在IE上运行。如何改进并保持简洁？需要javascript动态级联选择选项的简明实现

<html> 
    <head> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
    <title>选择地区</title> 
    </head> 
    <body> 
    <form id="area"> 
     <select id="selectProvince" onchange="setCities()"></select> 
     <select id="selectCity"></select> 
    </form> 
    </body> 
    <script> 
    var province_cities_map = { 
     北京: ['东城','西城'], 
     上海: ['黄浦','卢湾'], 
    }; 
    function setProvinces() { 
     provinces = Object.keys(province_cities_map); 
     selectProvince.length = 0; 
     for (i = 0; i < provinces.length; i++) selectProvince.options[i] = new Option(provinces[i]); 
     setCities(); 
    } 
    function setCities() { 
     cities = province_cities_map[selectProvince.value]; 
     selectCity.length = 0; 
     for (j = 0; j < cities.length; j++) selectCity.options[j] = new Option(cities[j]); 
    } 
    setProvinces(); 
    </script> 
</html>

来源

2013-04-27 Justin Peal

这里有几个问题。

一个是对象字面上的尾随逗号。把它拿出来：

var province_cities_map = { 
    北京: ['东城','西城'], 
    上海: ['黄浦','卢湾'] 
};

而且，你不会有Object.keys()旧的浏览器可用，你不应该在一个对象元素的顺序指望。如果您关心订单，您应该将数据放入数组中。

来源

2013-04-27 06:39:34

需要javascript动态级联选择选项的简明实现

回答

相关问题