|
说明: 和电脑玩玩剪子、包袱、锤的游戏(只不过图片可得换噢)
效果:
运行后查看！
代码: 要完成此效果需要两个步骤
第一步：把如下代码加入到<head>区域中
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
function playGame(choice) {
with (document.game) {
comp = Math.round((Math.random() * 2) + 1);
var choicename;
if (comp == 1) choicename = "rock";
if (comp == 2) choicename = "paper";
if (comp == 3) choicename = "scissors";
msg.value = 'The computer chose ' + choicename + '; ';
switch(choice) { // calculates score
case 1 : // rock
if (comp == 1) { draw.value++; msg.value += 'It is a draw.';
break; }
if (comp == 2) { loss.value++; msg.value += 'You lost!';
break; }
if (comp == 3) { win.value++; msg.value += 'You won!'; break;
}
case 2 : // paper
if (comp == 1) { win.value++; msg.value += 'You won!'; break;
}
if (comp == 2) { draw.value++; msg.value += 'It is a draw.';
break; }
if (comp == 3) { loss.value++; msg.value += 'You lost!';
break; }
case 3 : // scissors
if (comp == 1) { loss.value++; msg.value += 'You lost!';
break; }
if (comp == 2) { win.value++; msg.value += 'You won!'; break;
}
if (comp == 3) { draw.value++; msg.value += 'It is a draw.';
break; }
}
msg.value += ' Go again!';
}
}
// End -->
</script>
第二步：把如下代码加入到<body>区域中
<form name=game>
<table border=1 cellpadding=5>
<tr>
<td align=center>User:</td>
<td align=center><a href="javascript:void(0);"
onClick="playGame(1);">
<img src="http://www.ntc.com.cn/js/03/503/028_1.jpg"
width=29 height=23 border=0 alt=锤></a></td>
<td align=center><a href="javascript:void(0);"
onClick="playGame(2);">
<img src="http://www.ntc.com.cn/js/03/503/028_2.jpg"
width=29 height=23 border=0 alt=包袱></a></td>
<td align=center><a href="javascript:void(0);"
onClick="playGame(3);">
<img src="http://www.ntc.com.cn/js/03/503/028_3.jpg"
width=29 height=23 border=0 alt=剪子></a></td>
</tr>
<tr>
<td colspan=4 align=center><input type=text name=msg
size=45></td>
</tr>
<tr>
<td colspan=4 align=center>
<input type=text name=win readonly value="0"
size="2"> Wins
<input type=text name=loss readonly value="0"
size="2"> Losses
<input type=text name=draw readonly value="0"
size="2"> Draws
</td>
</tr>
</table>
</form>
| 
