需要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動態級聯選擇選項的簡明實現

回答

相關問題