使用 switch 語句來選擇要執行的多個程式碼塊之一
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>自動切換圖片-jq22.com</title>
<script src="http://libs.baidu.com/jquery/1.11.3/jquery.min.js"></script>
<style>
</style>
</head>
<body>
<img src="http://www.jq22.com/img/cs/300x500-1.png" id="img" width="200px" height="400px"><br>
<input type="button" id="img10" value="1" onclick="img('1')">
<input type="button" id="img11" value="2" onclick="img('2')">
<input type="button" id="img12" value="3" onclick="img('3')">
<input type="button" id="img13" value="4" onclick="img('4')">
<input type="button" id="img14" value="5" onclick="img('5')">
<script>
function img(num) {
var img = document.getElementById("img");
switch (num) {
case '1':
img.src = "http://www.jq22.com/img/cs/300x500-1.png";
break;
case '2':
img.src = "http://www.jq22.com/img/cs/300x500-2.png";
break;
case '3':
img.src = "http://www.jq22.com/img/cs/300x500-3.png";
break;
case '4':
img.src = "http://www.jq22.com/img/cs/300x500-4.png";
break;
case '5':
img.src = "http://www.jq22.com/img/cs/300x500-5.png";
break;
}
}
</script>
</body>
</html>
點選那個按鈕就會顯示所對應的圖片
num為傳的引數，break來阻止下面的程式碼繼續執行