昨晚睡前突然想用JS写一个贪吃蛇的程序。下午没什么事,于是就动笔了。不够熟练,花了两小时,更惭愧的是还有点问题,就是从吃第二个食物开始蛇的长度就不会增加了。整条蛇是一个对象数组,测试时发现数组的长度是正确的,只是保存的坐标有误,然未能想到怎么修正。
过了一天,晚上重新拿出来看,突然想到了是哪的问题。现将代码分享如下:
<
head
>
<
meta http
-
equiv
=
"
Content-Type
"
content
=
"
text/html; charset=gb2312
"
/>
<
title
>
贪吃蛇
</
title
>
<
style
>
.tb

...
{
font-size:9px;
}
</
style
>
</
head
>

<
body
>
<
table border
=
"
0
"
bgcolor
=
"
#CEE0F9
"
cellpadding
=
"
0
"
cellspacing
=
"
1
"
align
=
"
center
"
class
=
"
tb
"
>
<%
response.Write(
"
<tr><td></td>
"
)
for
i
=
10
to
34
response.Write(
"
<td height='10px' width='10px' bgcolor='white' align='center'>
"
&
i
&
"
</td>
"
&
chr(
13
))
next
for
i
=
10
to
34
response.Write(
"
<tr><td height='10px' width='10px' bgcolor='white' align='center'>
"
&
i
&
"
</td>
"
&
chr(
13
))
for
j
=
10
to
34
response.Write(
"
<td height='10px' width='10px' bgcolor='white' id='bg
"
&
i
&
j
&
"
'></td>
"
&
chr(
13
))
next
response.Write(
"
</tr>
"
&
chr(
13
))
next
%>
<
tr
><
td align
=
"
center
"
colspan
=
"
25
"
style
=
"
font-size:12px;
"
valign
=
"
middle
"
>
请选择难度:
<
select name
=
"
level
"
onChange
=
"
setlevel();
"
><
option value
=
"
400
"
>
一般
</
option
><
option value
=
"
250
"
>
中等
</
option
><
option value
=
"
150
"
>
疯狂
</
option
></
select
>
上:W
&
nbsp;下:S
&
nbsp;左:A
&
nbsp;右:D
&
nbsp;
</
td
></
tr
>
<
tr
><
td colspan
=
"
25
"
align
=
"
center
"
><
input type
=
"
button
"
value
=
"
开始
"
onClick
=
"
javascript:play();
"
name
=
"
playnow
"
></
td
></
tr
>
</
table
>
<
div id
=
"
test
"
style
=
"
font-size:12px;
"
></
div
>
</
body
>
<
script language
=
"
javascript
"
>
var
Time
=
350
,sco
=
100
,FlagTemp
=
""
;

function
snakecell(fx,fy)
//
定义蛇的结点

...
{
var snakecell = new Object();
snakecell.cellx = fx; //结点的横坐标
snakecell.celly = fy; //结点的纵坐标
return snakecell;
}
var
score
=
0
;
//
得分
var
Snake
=
new
Array();
var
MoveFlag
=
""
;
//
定义行走方向,为空表示不行走
function
createpoint()
//
随机生成小于25大于9的整数

...
{
var suc=false;
while(!suc)

...{
var number = Math.floor(Math.random()*35);
if(number>9)
suc=true;
}
return number;
}
function
checkfood(foodx,foody)
//
检测食物是否与snake的位置重叠并且坐标有效

...
{
if(foodx<10||foodx>34||foody<10||foody>34) //如果超出边界
return false;
else

...{
for(var i=0;i<Snake.length;i++)

...{
if(foodx==Snake[i].cellx&&foody==Snake[i].celly) //如果坐标值与某个元素的坐标值一致
return false;
}
return true;
}
}
function
createfood()
//
随机生成食物,以蓝色显示

...
{
var i=-1;
var j=-1;
while(!checkfood(i,j))

...{
i=createpoint();
j=createpoint();
}
document.getElementById("bg"+i+j).style.backgroundColor="blue";
}
function
createsnakehead()
//
创建蛇

...
{
Snake[0]=snakecell();
Snake[0].cellx=createpoint();
Snake[0].celly=createpoint();
showsnake();
}
function
ManageSnake()
//
控制这条蛇

...
{
if(MoveFlag=="") //如果标志为空表示暂停
return;
if(MoveFlag=="up") //向上移

...{
if(Snake[0].cellx==10)
MoveSnake(34,Snake[0].celly%35);
else
MoveSnake((Snake[0].cellx-1)%35,Snake[0].celly%35);
}
if(MoveFlag=="down")

...{
if(Snake[0].cellx==34)
MoveSnake(10,Snake[0].celly%35);
else
MoveSnake((Snake[0].cellx+1)%35,Snake[0].celly%35);
}
if(MoveFlag=="left")

...{
if(Snake[0].celly==10)
MoveSnake((Snake[0].cellx)%35,34);
else
MoveSnake((Snake[0].cellx)%35,(Snake[0].celly-1)%35);
}
if(MoveFlag=="right")

...{
if(Snake[0].celly==34)
MoveSnake((Snake[0].cellx)%35,10);
else
MoveSnake((Snake[0].cellx)%35,(Snake[0].celly+1)%35);
}
showsnake();
}
function
MoveSnake(hx,hy)
//
移动这条蛇

...
{
var headx=hx;
var heady=hy;
// alert(headx+" "+heady);
var endx=Snake[Snake.length-1].cellx;
var endy=Snake[Snake.length-1].celly;
if(document.getElementById("bg"+headx+heady).style.backgroundColor=="blue") //如果是食物

...{
for(var step=Snake.length-1;step>0;step--) //从第二个蛇结点起把前一结点的x,y坐标赋给自身

...{
Snake[step].cellx=Snake[step-1].cellx;
Snake[step].celly=Snake[step-1].celly;
}
Snake[0].cellx=headx; //将蛇头位置探前一步
Snake[0].celly=heady;
Snake[Snake.length]=snakecell(endx,endy); //增加一个蛇结点,位于尾部
createfood(); //创建一个食物
score=score+sco; //加单位分数
}
else

...{
if(document.getElementById("bg"+headx+heady).style.backgroundColor=="red") //如果是蛇的某一部位

...{
MoveFlag=""; //停止前进
document.all.level.disabled="";
// document.all.playnow.value="重来";
alert("你的得分是"+score);
return;
}
else

...{
for(var step=Snake.length-1;step>0;step--) //从最后一个蛇结点起把前一结点的x,y坐标赋给自身

...{
Snake[step].cellx=Snake[step-1].cellx;
Snake[step].celly=Snake[step-1].celly;
}
Snake[0].cellx=headx; //将蛇头位置探前一步
Snake[0].celly=heady;
}
}
document.getElementById("bg"+endx+endy).style.backgroundColor="white"; //恢复蛇尾处颜色
}
function
showsnake()
//
显示这条蛇

...
{
for(i=0;i<Snake.length;i++)
document.getElementById("bg"+Snake[i].cellx+Snake[i].celly).style.backgroundColor="red";
}
function
document.onkeydown()
//
捕获按的哪个键

...
{
if( event.keyCode=='87' ) //按下W键
MoveFlag="up";
if( event.keyCode=='65' ) //按下A键
MoveFlag="left";
if( event.keyCode=='83' ) //按下S键
MoveFlag="down";
if( event.keyCode=='68' ) //按下D键
MoveFlag="right";
if(event.keyCode=='27') //按下ESC

...{
MoveFlag="";
document.all.playnow.value="开始";
}
}
function
setlevel()

...
{
Time=document.all.level.options[document.all.level.selectedIndex].value;
sco==450-Time;
}
function
play()

...
{
document.all.level.disabled="disabled";

if(document.all.playnow.value=="暂停")...{
FlagTemp=MoveFlag;
MoveFlag="";
document.all.playnow.value="开始";
}

else...{
MoveFlag=FlagTemp;
document.all.playnow.value="暂停";
}
if(document.all.playnow.value=="重来")
window.refresh;
setInterval("ManageSnake()",Time); //开始
}
createfood();
//
初始化一个食物
createsnakehead();
//
初始化一个蛇头
</
script
>
</
html
>
使用时请保存为.asp文件。