根据他从下拉菜单中的选择，将用户引导到网址 [英] directing user to url based on his choice from dropdown menu
本文介绍了根据他从下拉菜单中的选择，将用户引导到网址的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我已经找到了一个我需要的脚本（下拉菜单），但是我希望它可以根据他从下拉菜单中的选择将用户带到一个外部/内部URL，例如，如果他选择美国，然后选择NY，那么他们去url＃1，如果选择美国和NJ去url＃2，这就是我想要的
i have found a script that do what i need (dropdown menus) but i want it to take user to an external/internal url based on his choice from the dropdown menu for example if he choose USA and then NY they go to url#1 and if choose USA and NJ go to url#2, that's all i want
脚本：
<!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>
请帮助！
推荐答案
<!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>
这篇关于根据他从下拉菜单中的选择，将用户引导到网址的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
