根据用户从下拉菜单中的选择将用户引导至 url答案

【问题标题】：directing user to url based on his choice from dropdown menu根据用户从下拉菜单中的选择将用户引导至 url
【发布时间】：2012-12-27 03:18:46
【问题描述】：

我找到了一个可以满足我需要的脚本（下拉菜单），但我希望它根据用户从下拉菜单中的选择将用户带到外部/内部 url，例如，如果他选择美国，然后他们去纽约url#1，如果选择 USA 和 NJ，请转到 url#2，这就是我想要的

脚本：

<!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>

请帮忙！

【问题讨论】：

标签： javascript drop-down-menu menu

【解决方案1】：

<!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"]
        }
        var navURLs = {
            "USA": {"NY": "http://www.yahoo.com","NJ": "http://www.google.com"},
            "Singapore": {"taas": "http://www.bing.com","naas": "http://www.ibm.com"}
        }
        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);
            navURL = navURLs[country][city];
            if(navURL){
                alert(navURL);                    
                window.location.href = navURL;
            }
        }
        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>

【讨论】：

非常感谢您的帮助，我也可以删除单击后立即出现的弹出框吗？我只想让它重定向？
是的 - 只需删除行 alert(navURL);