redirect to webpage depending on selection in two select drop downs
I need a javascript solution for the following situation:
I have two select drop down menus. The combination of the two of them will redirect to either of three websites after clicking the submit button:
www.exampledomainI
www.exampledomainII
www.exampledomainIII
If "A" selected it always should go straight to www.exampledomainI. No selection of id="number" necessary (select menu id="number" should disappear when selected and vice versa reappear when selection is anything else then "A" in id="letter")
IF the combination (eg A4 or C1 etc) is part of an array within the JavaScript than it should go to www.exampledomainII.
If it is part of a second array than it should go to www.exampledomainIII.
<select id="letter">
<option>A</option>
<option>B</option>
<opt开发者_JAVA技巧ion>C</option>
</select>
<select id="number">
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
</select>
<input type="submit">
Thanks a lot
Put the elements in a form, give the options a value attribute, attach an onsubmit listener to the form. If javascript is enabled, do the logic and set window.location.href appropriately. If javascript is disabled, not available or fails, have the server do the logic. e.g.
<form action="..." onsubmit="return doRedirect(this);">
<select id="letter">
<option value="A">A
<option value="B">B
<option value="C">C
</select>
<select id="number">
<option value="1">1
<option value="2">2
<option value="3">3
</select>
<input type="submit">
</form>
<script type="text/javascript">
function doRedirect(form) {
var letter = form.letter.value;
var number = form.number.value;
if ( /* some tests using letter and number */) {
window.location.href = 'http://whatever.com';
return false;
} else if ( /* some other tests using letter and number */) {
window.location.href = 'http://whatever.com';
return false;
} else if ( /* and so on... */) {
/* whatever */
return false;
}
}
</script>
cannot understand very well your explanation but this may illustrate a little
letter_value = document.getElementById('letter').value;
number_value = document.getElementById('number').value;
if (letter_value == 'A') {
window.location = 'www.exampledomainI';
}
else {
//cannot understand your explanation for this cases, but just use if else for each case, for example
if (letter_value == 'B' && (number_value == 1 || number_value == 3)) {
window.location = 'www.exampledomainII';
}
if () {
...
}
}
Here a simple solution for your question
<html>
<head>
<script>
function loadNew()
{
selectLetter = document.forms[0].letter.value.toString() + document.forms[0].number.value.toString();
switch (selectLetter)
{
case "B2", "C1":
location.href = "www.exampledomainII.com";
break;
default:
location.href = "www.exampledomainI.com";
break;
}
}
function visibilityT()
{
if (document.forms[0].letter.value.toString() == "A")
{
document.forms[0].number.style.visibility = "hidden";
} else {
document.forms[0].number.style.visibility = "visible";
}
}
</script>
</head>
<body onLoad="visibilityT()">
<form onSubmit>
<select name="letter" id="letter" onChange="visibilityT()">
<option>A</option>
<option selected>B</option>
<option>C</option>
</select>
<select name="number" id="number">
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
</select>
<input type="button" value="submit" onClick="loadNew()">
</form>
</body>
</html>
加载中,请稍侯......
精彩评论