关闭

javascript网页游戏--贪食蛇代码

标签: javascript网页游戏classinputbuttonfunction
719人阅读 评论(1) 收藏 举报

游戏地址:http://www.uptoday.cn/shtml/article1289.htm

用键盘上下左右键控制方向, 每吃到食物,移动速度加快.

<HTML>
 <HEAD>
  <TITLE> 贪食蛇 </TITLE>
  <META NAME="Generator" CONTENT="EditPlus">
  <META NAME="Author" CONTENT="">
  <META NAME="Keywords" CONTENT="">
  <META NAME="Description" CONTENT="">
 </HEAD>
<style>
.td{width:30px;height:30px;border-color:#ccc;background:#006600;}
body{background:#000;}
</style>
<SCRIPT LANGUAGE="JavaScript">
<!--
    d=document.getElementById
   var gap_time=200;           //移动速度
   var front_color="#ffffff";  //蛇身颜色
   var len=3;                  //蛇身长度
   var cx=new Array();         //位置
   var cy=new Array();
   var tempx=new Array();
   var tempy=new Array();
   var isend="no";
   var origin="39";
   tempx[0]=1;tempy[0]=4;
cx[0]=1;cy[0]=4;
cx[1]=1;cy[1]=3;
cx[2]=1;cy[2]=2;
cx[3]=1;cy[3]=1;
cx[4]=1;cy[4]=1;

    function putfood(){    //生成食物
     var foodx=4;
  var foody=5;
      while(1){
         foodx=Math.floor(Math.random()*(10))+1;
   foody=Math.floor(Math.random()*(10))+1;

   if(d("td"+(foodx)+"_"+(foody)).style.background!=front_color)
   break;
        }
     
      d("td"+foodx+"_"+foody).style.background="#FF0000";
   d("foodx").value=foodx;d("foody").value=foody;
 }


function change(){        //方向键控制触发
  var direction=event.keyCode;
  if(Math.abs(direction-(d("ori").value))!=2){
    clearTimeout(q);
    cx[0]=d("cx").value;
 cy[0]=d("cy").value;
 
    q=setTimeout("automove("+direction+","+direction+","+cx[0]+","+cy[0]+")",gap_time);
 }

 }
 
 //**************************************************************
 //  主程序                                                     *
    //**************************************************************
 function automove(direction,ori,x,y) { 
    clearTimeout(q);
   cx[0]=x;cy[0]=y;
   tempx[0]=x;tempy[0]=y;
   d("ori").value=ori;
  origin=ori;
  for(i=1;i<=len;i++){      //结束! GAME OVER !
     if(x==cx[i]&&y==cy[i]){window.alert("GAME  OVER!");isend="yes";d("button1").value="重来";}
     if((x<1||y>10||x>10||y<1)&&isend!="yes"){window.alert("GAME  OVER!!!!!");isend="yes";d("button1").value="重来";}
  }

 if(isend!="yes")
 {
                                   
       //吃到食物
    if(cx[0]==d("foodx").value&&cy[0]==d("foody").value)
  {putfood();
   len++;
  cx[len]=cx[len-1];
  cy[len]=cy[len-1];
  gap_time-=5;
  if(gap_time<60)gap_time=60;
  }


d("td"+(cx[len])+"_"+(cy[len])).style.background="#006600";
 for (i=1;i<=len;i++){   //跟随移动
      //
      tx=cx[i];ty=cy[i];
      cx[i]=tempx[0];cy[i]=tempy[0];
   tempx[0]=tx;tempy[0]=ty;

       //  d("cx"+i).value=cx[i];d("cy"+i).value=cy[i];
        
      d("td"+(cx[i])+"_"+(cy[i])).style.background=front_color;
    }  

       
      // d("td"+(cx[0])+"_"+(cy[0])).style.background="#006600";
 
 switch (direction){     //判断方向
 case 38: //上

           cx[0]--;
      d("td"+(cx[0])+"_"+(cy[0])).style.background=front_color;
 
           q=setTimeout("automove("+direction+",38,"+cx[0]+","+cy[0]+")",gap_time);
  break;
 case 40: //下
           cx[0]++;
     d("td"+(cx[0])+"_"+(cy[0])).style.background=front_color;
            q=setTimeout("automove("+direction+",40,"+cx[0]+","+cy[0]+")",gap_time);
  break;
 case 37: //左
            cy[0]--;
     d("td"+(cx[0])+"_"+(cy[0])).style.background=front_color;
         q=setTimeout("automove("+direction+",37,"+cx[0]+","+cy[0]+")",gap_time);
  break;
 case 39: //右
            cy[0]++;
     d("td"+(cx[0])+"_"+(cy[0])).style.background=front_color;
           q=setTimeout("automove("+direction+",39,"+cx[0]+","+cy[0]+")",gap_time);
  break;
    default:
          q=setTimeout("automove("+ori+","+ori+","+cx[0]+","+cy[0]+")",gap_time);
  break;
      }
   d("cx").value=cx[0];d("cy").value=cy[0];

 
    d("info").innerHTML=" <FONT SIZE=5 COLOR=white>"+(len-3)+"</FONT> ";
}
    }
 function onload(){
 document.getElementById('td1_1').style.background=front_color;
 document.getElementById('td1_2').style.background=front_color;
 document.getElementById('td1_3').style.background=front_color;
 document.getElementById('td1_4').style.background=front_color;
 q=setTimeout('automove(39,39,1,4)',gap_time);
 putfood();
 
 }

 function button(m){
  if(m=="开始"){
    onload();
    d("button1").value="暂停";
  }else
  if (m=="暂停")
  {
  d("button1").value="继续";
   clearTimeout(q);

  }else if (m=="继续")
 
  {
   onx=cx[0];ony=cy[0];
   q=setTimeout('automove('+origin+','+origin+','+onx+','+ony+')',gap_time);
  d("button1").value="暂停";
  }
  else{window.location.reload();}
 
 
 }
//-->
</SCRIPT>

 <BODY  onkeydown="change()" >
  <TABLE border=1 align=center>

  <tr><TD class=td id=td1_1></TD><TD class=td id=td1_2></TD><TD class=td id=td1_3></TD><TD class=td id=td1_4></TD><TD class=td id=td1_5></TD><TD class=td id=td1_6></TD><TD class=td id=td1_7></TD><TD class=td id=td1_8></TD><TD class=td id=td1_9></TD><TD class=td id=td1_10></TD></tr><tr><TD class=td id=td2_1></TD><TD class=td id=td2_2></TD><TD class=td id=td2_3></TD><TD class=td id=td2_4></TD><TD class=td id=td2_5></TD><TD class=td id=td2_6></TD><TD class=td id=td2_7></TD><TD class=td id=td2_8></TD><TD class=td id=td2_9></TD><TD class=td id=td2_10></TD></tr><tr><TD class=td id=td3_1></TD><TD class=td id=td3_2></TD><TD class=td id=td3_3></TD><TD class=td id=td3_4></TD><TD class=td id=td3_5></TD><TD class=td id=td3_6></TD><TD class=td id=td3_7></TD><TD class=td id=td3_8></TD><TD class=td id=td3_9></TD><TD class=td id=td3_10></TD></tr><tr><TD class=td id=td4_1></TD><TD class=td id=td4_2></TD><TD class=td id=td4_3></TD><TD class=td id=td4_4></TD><TD class=td id=td4_5></TD><TD class=td id=td4_6></TD><TD class=td id=td4_7></TD><TD class=td id=td4_8></TD><TD class=td id=td4_9></TD><TD class=td id=td4_10></TD></tr><tr><TD class=td id=td5_1></TD><TD class=td id=td5_2></TD><TD class=td id=td5_3></TD><TD class=td id=td5_4></TD><TD class=td id=td5_5></TD><TD class=td id=td5_6></TD><TD class=td id=td5_7></TD><TD class=td id=td5_8></TD><TD class=td id=td5_9></TD><TD class=td id=td5_10></TD></tr><tr><TD class=td id=td6_1></TD><TD class=td id=td6_2></TD><TD class=td id=td6_3></TD><TD class=td id=td6_4></TD><TD class=td id=td6_5></TD><TD class=td id=td6_6></TD><TD class=td id=td6_7></TD><TD class=td id=td6_8></TD><TD class=td id=td6_9></TD><TD class=td id=td6_10></TD></tr><tr><TD class=td id=td7_1></TD><TD class=td id=td7_2></TD><TD class=td id=td7_3></TD><TD class=td id=td7_4></TD><TD class=td id=td7_5></TD><TD class=td id=td7_6></TD><TD class=td id=td7_7></TD><TD class=td id=td7_8></TD><TD class=td id=td7_9></TD><TD class=td id=td7_10></TD></tr><tr><TD class=td id=td8_1></TD><TD class=td id=td8_2></TD><TD class=td id=td8_3></TD><TD class=td id=td8_4></TD><TD class=td id=td8_5></TD><TD class=td id=td8_6></TD><TD class=td id=td8_7></TD><TD class=td id=td8_8></TD><TD class=td id=td8_9></TD><TD class=td id=td8_10></TD></tr><tr><TD class=td id=td9_1></TD><TD class=td id=td9_2></TD><TD class=td id=td9_3></TD><TD class=td id=td9_4></TD><TD class=td id=td9_5></TD><TD class=td id=td9_6></TD><TD class=td id=td9_7></TD><TD class=td id=td9_8></TD><TD class=td id=td9_9></TD><TD class=td id=td9_10></TD></tr><tr><TD class=td id=td10_1></TD><TD class=td id=td10_2></TD><TD class=td id=td10_3></TD><TD class=td id=td10_4></TD><TD class=td id=td10_5></TD><TD class=td id=td10_6></TD><TD class=td id=td10_7></TD><TD class=td id=td10_8></TD><TD class=td id=td10_9></TD><TD class=td id=td10_10></TD></tr>
  </TABLE><BR>
<center> 
<div id="info"></div><BR>
<center> <INPUT TYPE="button" value="开始" onclick="button(this.value)" id="button1"></center>

<FORM METHOD=POST ACTION="" name=""><!-- 蛇身每格坐标 -->
  <INPUT TYPE="hidden" NAME="cx" id="cx"><INPUT TYPE="hidden" NAME="cy" id="cy">
  <INPUT TYPE=hidden NAME=cx1 id=cx1><INPUT TYPE=hidden NAME=cy1 id=cy1><INPUT TYPE=hidden NAME=cx2 id=cx2><INPUT TYPE=hidden NAME=cy2 id=cy2><INPUT TYPE=hidden NAME=cx3 id=cx3><INPUT TYPE=hidden NAME=cy3 id=cy3><INPUT TYPE=hidden NAME=cx4 id=cx4><INPUT TYPE=hidden NAME=cy4 id=cy4><INPUT TYPE=hidden NAME=cx5 id=cx5><INPUT TYPE=hidden NAME=cy5 id=cy5><INPUT TYPE=hidden NAME=cx6 id=cx6><INPUT TYPE=hidden NAME=cy6 id=cy6><INPUT TYPE=hidden NAME=cx7 id=cx7><INPUT TYPE=hidden NAME=cy7 id=cy7><INPUT TYPE=hidden NAME=cx8 id=cx8><INPUT TYPE=hidden NAME=cy8 id=cy8><INPUT TYPE=hidden NAME=cx9 id=cx9><INPUT TYPE=hidden NAME=cy9 id=cy9><INPUT TYPE=hidden NAME=cx10 id=cx10><INPUT TYPE=hidden NAME=cy10 id=cy10><INPUT TYPE=hidden NAME=cx11 id=cx11><INPUT TYPE=hidden NAME=cy11 id=cy11><INPUT TYPE=hidden NAME=cx12 id=cx12><INPUT TYPE=hidden NAME=cy12 id=cy12><INPUT TYPE=hidden NAME=cx13 id=cx13><INPUT TYPE=hidden NAME=cy13 id=cy13><INPUT TYPE=hidden NAME=cx14 id=cx14><INPUT TYPE=hidden NAME=cy14 id=cy14><INPUT TYPE=hidden NAME=cx15 id=cx15><INPUT TYPE=hidden NAME=cy15 id=cy15><INPUT TYPE=hidden NAME=cx16 id=cx16><INPUT TYPE=hidden NAME=cy16 id=cy16><INPUT TYPE=hidden NAME=cx17 id=cx17><INPUT TYPE=hidden NAME=cy17 id=cy17><INPUT TYPE=hidden NAME=cx18 id=cx18><INPUT TYPE=hidden NAME=cy18 id=cy18><INPUT TYPE=hidden NAME=cx19 id=cx19><INPUT TYPE=hidden NAME=cy19 id=cy19><INPUT TYPE=hidden NAME=cx20 id=cx20><INPUT TYPE=hidden NAME=cy20 id=cy20><INPUT TYPE=hidden NAME=cx21 id=cx21><INPUT TYPE=hidden NAME=cy21 id=cy21><INPUT TYPE=hidden NAME=cx22 id=cx22><INPUT TYPE=hidden NAME=cy22 id=cy22><INPUT TYPE=hidden NAME=cx23 id=cx23><INPUT TYPE=hidden NAME=cy23 id=cy23><INPUT TYPE=hidden NAME=cx24 id=cx24><INPUT TYPE=hidden NAME=cy24 id=cy24><INPUT TYPE=hidden NAME=cx25 id=cx25><INPUT TYPE=hidden NAME=cy25 id=cy25><INPUT TYPE=hidden NAME=cx26 id=cx26><INPUT TYPE=hidden NAME=cy26 id=cy26><INPUT TYPE=hidden NAME=cx27 id=cx27><INPUT TYPE=hidden NAME=cy27 id=cy27><INPUT TYPE=hidden NAME=cx28 id=cx28><INPUT TYPE=hidden NAME=cy28 id=cy28><INPUT TYPE=hidden NAME=cx29 id=cx29><INPUT TYPE=hidden NAME=cy29 id=cy29><INPUT TYPE=hidden NAME=cx30 id=cx30><INPUT TYPE=hidden NAME=cy30 id=cy30><INPUT TYPE=hidden NAME=cx31 id=cx31><INPUT TYPE=hidden NAME=cy31 id=cy31><INPUT TYPE=hidden NAME=cx32 id=cx32><INPUT TYPE=hidden NAME=cy32 id=cy32><INPUT TYPE=hidden NAME=cx33 id=cx33><INPUT TYPE=hidden NAME=cy33 id=cy33><INPUT TYPE=hidden NAME=cx34 id=cx34><INPUT TYPE=hidden NAME=cy34 id=cy34><INPUT TYPE=hidden NAME=cx35 id=cx35><INPUT TYPE=hidden NAME=cy35 id=cy35><INPUT TYPE=hidden NAME=cx36 id=cx36><INPUT TYPE=hidden NAME=cy36 id=cy36><INPUT TYPE=hidden NAME=cx37 id=cx37><INPUT TYPE=hidden NAME=cy37 id=cy37><INPUT TYPE=hidden NAME=cx38 id=cx38><INPUT TYPE=hidden NAME=cy38 id=cy38><INPUT TYPE=hidden NAME=cx39 id=cx39><INPUT TYPE=hidden NAME=cy39 id=cy39><INPUT TYPE=hidden NAME=cx40 id=cx40><INPUT TYPE=hidden NAME=cy40 id=cy40><INPUT TYPE=hidden NAME=ori id=ori> 
  <BR><INPUT TYPE="hidden" NAME="foodx" id="foodx"><INPUT TYPE="hidden" NAME="foody" id="foody">
  </FORM></center>
 </BODY>
</HTML>
<!-- 边缘部分 -->
<div class=td  style='display:none;' id=td0_0></div><div class=td  style='display:none;' id=td0_1></div><div class=td  style='display:none;' id=td0_2></div><div class=td  style='display:none;' id=td0_3></div><div class=td  style='display:none;' id=td0_4></div><div class=td  style='display:none;' id=td0_5></div><div class=td  style='display:none;' id=td0_6></div><div class=td  style='display:none;' id=td0_7></div><div class=td  style='display:none;' id=td0_8></div><div class=td  style='display:none;' id=td0_9></div><div class=td  style='display:none;' id=td0_10></div><div class=td  style='display:none;' id=td0_11></div><div class=td  style='display:none;' id=td11_0></div><div class=td  style='display:none;' id=td11_1></div><div class=td  style='display:none;' id=td11_2></div><div class=td  style='display:none;' id=td11_3></div><div class=td  style='display:none;' id=td11_4></div><div class=td  style='display:none;' id=td11_5></div><div class=td  style='display:none;' id=td11_6></div><div class=td  style='display:none;' id=td11_7></div><div class=td  style='display:none;' id=td11_8></div><div class=td  style='display:none;' id=td11_9></div><div class=td  style='display:none;' id=td11_10></div><div class=td  style='display:none;' id=td11_11></div><div class=td  style='display:none;' id=td1_0></div><div class=td  style='display:none;' id=td2_0></div><div class=td  style='display:none;' id=td3_0></div><div class=td  style='display:none;' id=td4_0></div><div class=td  style='display:none;' id=td5_0></div><div class=td  style='display:none;' id=td6_0></div><div class=td  style='display:none;' id=td7_0></div><div class=td  style='display:none;' id=td8_0></div><div class=td  style='display:none;' id=td9_0></div><div class=td  style='display:none;' id=td10_0></div><div class=td  style='display:none;' id=td1_11></div><div class=td  style='display:none;' id=td2_11></div><div class=td  style='display:none;' id=td3_11></div><div class=td  style='display:none;' id=td4_11></div><div class=td  style='display:none;' id=td5_11></div><div class=td  style='display:none;' id=td6_11></div><div class=td  style='display:none;' id=td7_11></div><div class=td  style='display:none;' id=td8_11></div><div class=td  style='display:none;' id=td9_11></div><div class=td  style='display:none;' id=td10_11></div>

 游戏地址:http://www.uptoday.cn/shtml/article1289.htm
0
0

查看评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场
    个人资料
    • 访问:13056次
    • 积分:244
    • 等级:
    • 排名:千里之外
    • 原创:10篇
    • 转载:0篇
    • 译文:0篇
    • 评论:9条
    最新评论
    我的网络