JavaScript Tutorial/Statement/Switch
Содержание
Switch Statement with calculation
<html>
<head>
<title>Switch Statement Demo</title>
<script language="javascript" type="text/javascript">
<!--
switch (1+1){
case "a":
alert(1);
case 2:
alert(2);
case true:
alert(3);
}
//-->
</script>
</head>
<body>
<h1>Switch Statement Demo</h1>
</body>
</html>
Switch statement with default value
<html>
<head>
<title>A Simple Page</title>
<script language="JavaScript">
<!--
var yourchoice;
yourchoice = prompt("Choose a number between 1 and 4", "1, 2, 3 or 4")
switch (yourchoice)
{
case "1":
alert("You typed in a 1");
break;
case "2":
alert("You typed in a 2");
break;
case "3":
alert("You typed in a 3");
break;
case "4":
alert("You typed in a 4");
break;
default:
alert("You didn"t type in a number between 1 and 4");
break;
}
// -->
</script>
</head>
<body>
</body>
</html>
Switch Statement with Integer as the control variable
<html>
<head>
<title>Switch Statement Demo</title>
<script language="javascript" type="text/javascript">
<!--
switch (2){
case "a":
alert(1);
case 2:
alert(2);
case true:
alert(3);
}
//-->
</script>
</head>
<body>
<h1>Switch Statement Demo</h1>
</body>
</html>
Switch statement with return value from a prompt dialog
<html>
<head>
<title>A Simple Page</title>
<script language="JavaScript">
<!--
var yourchoice;
yourchoice = prompt("Choose a number between 1 and 4", "1, 2, 3 or 4")
switch (yourchoice)
{
case "1":
alert("You typed in a 1");
break;
case "2":
alert("You typed in a 2");
break;
case "3":
alert("You typed in a 3");
break;
case "4":
alert("You typed in a 4");
break;
}
// -->
</script>
</head>
<body>
</body>
</html>
Switch with boolean value
<html>
<head>
<title>A Simple Page</title>
<script language="JavaScript">
<!--
var yourchoice;
yourchoice = confirm("Are you at your computer now?")
switch (yourchoice)
{
case true:
alert("true");
break;
case false:
alert("false");
break;
}
// -->
</script>
</head>
<body>
</body>
</html>
Use switch statement to deal with form input value
<html>
<head>
<title>Using the switch statement</title>
<script language="JavaScript">
<!--
function verifyDay(form){
var myEntry = form.day.value.toUpperCase();
var firstPart = "You have entered a day at the first of the week";
var endPart = "You have entered a day at the end of the week";
var weekEnd = "You have entered a weekend day";
switch(myEntry){
case "MONDAY" :
alert(firstPart);
break;
case "TUESDAY" :
alert(firstPart);
break;
case "WEDNESDAY" :
alert("You have entered a "hump" day");
break;
case "THURSDAY" :
alert(endPart);
break;
case "FRIDAY" :
alert(endPart);
break;
case "SATURDAY" :
alert(weekEnd);
break;
case "SUNDAY" :
alert(weekEnd);
break;
default :
alert("You have entered an invalid day");
}
}
-->
</script>
</head>
<body>
<form name="myForm">
<b>Please enter a day of the week:</b><br>
<input type=TEXT value="" name="day">
<input type=BUTTON value="Verify" name="myButton" onClick="verifyDay(this.form)">
</form>
</body>
</html>
Using the switch Structure
JavaScript offers the switch statement as an alternative to using the if...else structure.
The switch statement is useful when testing all the possible results of an expression.
The format of a switch structure looks like the following:
switch (expression)
{
case label1:
statement1;
break;
case label2:
statement2;
break;
default:
statement3;
}