Drop down menu for selecting country then states

前端 未结 1 1889
栀梦
栀梦 2021-01-28 18:55

I want a to create a drop down menu which generates another drop down menu on the base of selected value Just for example if select United States from the 1st drop down then 2nd

相关标签:
1条回答
  • 2021-01-28 19:19
    <!DOCTYPE html>
    <html>
    <head>
        <title></title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <script type="text/javascript">
            var citiesByState = {
                USA: ["NY","NJ"],
                Singapore: ["taas","naas"]
            }
            function makeSubmenu(value) {
                if(value.length==0) document.getElementById("citySelect").innerHTML = "<option></option>";
                else {
                    var citiesOptions = "";
                    for(cityId in citiesByState[value]) {
                        citiesOptions+="<option>"+citiesByState[value][cityId]+"</option>";
                    }
                    document.getElementById("citySelect").innerHTML = citiesOptions;
                }
            }
            function displaySelected() {
                var country = document.getElementById("countrySelect").value;
                var city = document.getElementById("citySelect").value;
                alert(country+"\n"+city);
            }
            function resetSelection() {
                document.getElementById("countrySelect").selectedIndex = 0;
                document.getElementById("citySelect").selectedIndex = 0;
            }
        </script>
    </head>
    <body onload="resetSelection()">
        <select id="countrySelect" size="1" onchange="makeSubmenu(this.value)">
            <option></option>
            <option>USA</option>
            <option>Singapore</option>
        </select>
        <select id="citySelect" size="1">
            <option></option>
        </select>
        <button onclick="displaySelected()">show selected</button>
    </body>
    </html>
    
    0 讨论(0)
提交回复
热议问题