Ok here's the deal, I'm trying to have a switch statement redirect to another page depending on what option is selected in a select box. Below is a sample i'm working with and trying to figure out, any help at all would be greatly apreciated.
<html>
<body>
<form name="form1">
<select name="select1">
<option value="p1">p1</option>
<option value="p2">p2</optino>
</select>
</form>
<script type="text/javascript">
<!--
var sel = document.form1.select1;
var txt = sel.options[sel.selectedIndex].text;
var opt = sel.options[sel.selectedIndex].value;
switch (sel)
{
case 'p1': window.location = ''
break;
case 'p2': window.location = '.'
break;
}
</script>
<p>Set the variable to different value and then try...</p>
</body>
</html>
Ok here's the deal, I'm trying to have a switch statement redirect to another page depending on what option is selected in a select box. Below is a sample i'm working with and trying to figure out, any help at all would be greatly apreciated.
<html>
<body>
<form name="form1">
<select name="select1">
<option value="p1">p1</option>
<option value="p2">p2</optino>
</select>
</form>
<script type="text/javascript">
<!--
var sel = document.form1.select1;
var txt = sel.options[sel.selectedIndex].text;
var opt = sel.options[sel.selectedIndex].value;
switch (sel)
{
case 'p1': window.location = 'http://www.yahoo.'
break;
case 'p2': window.location = 'http://www.google..'
break;
}
</script>
<p>Set the variable to different value and then try...</p>
</body>
</html>
4 Answers
Reset to default 4I remend you avoid switch-statements. How about this?
<select name="select1">
<option data-url="http://www.yahoo." value="p1">p1</option>
<option data-url="http://www.google." value="p2">p2</option>
</select>
And:
document.getElementById("select1").onchange = function () {
var url = this.options[this.selectedIndex].getAttribute("data-url");
window.location = url;
};
Edit: I changed the example to use html 5 data attributes (not to worry, they are 100% supported in all browsers), since you need the value attribute for something else.
- You need to bind an event handler
- Your switch was using the wrong value
See http://www.jsfiddle/vDFpZ/
<html>
<body>
<form name="form1">
<select name="select1">
<option value="p1">p1</option>
<option value="p2">p2</option>
</select>
</form>
<script type="text/javascript">
window.onload = function () {
document.getElementsByName("select1")[0].onchange = function () {
var sel = this.options[this.selectedIndex];
var text = sel.text;
var val = sel.value;
switch (val)
{
case 'p1': window.location = 'http://www.yahoo.'
break;
case 'p2': window.location = 'http://www.google..'
break;
}
}
}
</script>
<p>Set the variable to different value and then try...</p>
</body>
</html>
i noticed that you did not bind an change handler to the select, so when the user selects a value nothing happens.
You've got some typos, your second "/option" and your "google.". And the switch statement has nothing to do with your error. You have no event listener/onchange handler and you aren't switching with the value from the select option
https://developer.mozilla/en/DOM/element.onchange https://developer.mozilla/en/DOM/element.addEventListener
发布者：admin，转转请注明出处：http://www.yc00.com/questions/1744707722a4589154.html
评论列表（0条）