189 8069 5689

jQuery写个贪吃蛇

都说码农都该有自己的博客，我也整个，这是第一次发。

创新互联专注于企业营销型网站、网站重做改版、黎川网站定制设计、自适应品牌网站建设、H5建站、商城建设、集团公司官网建设、成都外贸网站建设公司、高端网站制作、响应式网页设计等建站业务，价格优惠性价比高，为黎川等各大城市提供网站开发制作服务。

自学JS/JQ半年多，半年前要是听说谁会用JS/JQ做个贪吃蛇我都会觉得他是大神，现在觉得，也就那样了。

最近没项目做，正好想到贪吃蛇我现在应该能做出来了。

说干就干，先不看别人的代码，自己搞，半天的时间搞定了。

偷个懒用JQ写的，也不知道有没有啥问题。

 

  1.  
  2.  
  3.  
  4. 无标题文档 
  5.  
  6.  
  7. $(document).ready(function(){ 
  8.     var hgn = 15;//横格数 
  9.     var sgn = 10;//竖格数 
  10.     var sc = 3;//初始蛇长 
  11.     var sind = new Array;//蛇索引 
  12.     var sd = 200;//速度 
  13.     var fxcur = null; 
  14.     var inv; 
  15.     var dan_ind;//胆索引 
  16.     var stop_onf = true;//暂停 
  17.      
  18.     $(".body").css({width:50*hgn+"px"}); 
  19.     $(".msg").css({width:$(".body").css("width")}); 
  20.     for(var i=0;i
  21.         for(var j=0;j
  22.             $(".body ul").append("
  23. "); 
  24.         } 
  25.     } 
  26.     for(var i=0;i
  27.         sind[i]=i; 
  28.     } 
  29.      
  30.     dan(); 
  31.     she(); 
  32.     move(); 
  33.      
  34.  
  35.      
  36.      
  37.     //绘蛇 
  38.     function she(){ 
  39.         $("ul li").removeClass("she"); 
  40.         for(var i=0;i
  41.             $("ul li:eq("+sind[i]+")").addClass("she"); 
  42.         } 
  43.     } 
  44.      
  45.     //移动 
  46.     function move(){ 
  47.         if(inv){ 
  48.             window.clearInterval(inv); 
  49.         } 
  50.         inv = window.setInterval(function(){ 
  51.             goway(fxcur); 
  52.         },sd); 
  53.     } 
  54.      
  55.     //移动开关 
  56.     function stopmove(){ 
  57.         if(stop_onf){ 
  58.             if(inv){ 
  59.                 window.clearInterval(inv); 
  60.             } 
  61.             $(".msg").animate({top:(parseInt($(".body").css("height"))/2-50)+"px"}).html("STOP"); 
  62.         }else{ 
  63.             $(".msg").html("GO").animate({top:"-50px"}); 
  64.             move(); 
  65.         } 
  66.         stop_onf = !stop_onf; 
  67.     } 
  68.      
  69.     //结束 
  70.     function gameover(){ 
  71.         if(inv){ 
  72.             window.clearInterval(inv); 
  73.         } 
  74.         $(".msg").animate({top:(parseInt($(".body").css("height"))/2-50)+"px"}).html("GAME OVER"); 
  75.     } 
  76.      
  77.     //判断撞到自己 
  78.     function zsf(){ 
  79.         for(var i=0;i
  80.             if(sind[sc-1]==sind[i]){ 
  81.                 gameover(); 
  82.                 return true; 
  83.             } 
  84.         } 
  85.         return false; 
  86.     } 
  87.      
  88.     //移动功能 
  89.     function goway(fx){ 
  90.          
  91.         for(var i=0;i
  92.             if(sind[sc-1]==sind[i]){ 
  93.                 gameover(); 
  94.                 return; 
  95.             } 
  96.         } 
  97.          
  98.          
  99.         if(fx=="you"){ 
  100.             if(sind[sc-1]+1==dan_ind){//吃胆 
  101.                 scsc=sc+1; 
  102.                 sind[sc-1]=dan_ind; 
  103.                 dan(); 
  104.                 she(); 
  105.                 return; 
  106.             }else if((sind[sc-1]+1)%hgn==0){//撞墙 
  107.                 gameover(); 
  108.                 return; 
  109.             } 
  110.              
  111.             for(var i=0;i
  112.                 if(i==sc-1){ 
  113.                     sind[i]=sind[i]+1; 
  114.                     she(); 
  115.                     return; 
  116.                 } 
  117.                 sind[i]=sind[i+1]; 
  118.             } 
  119.         }else if(fx=="xia"){ 
  120.             if(sind[sc-1]+hgn==dan_ind){//吃胆 
  121.                 scsc=sc+1; 
  122.                 sind[sc-1]=dan_ind; 
  123.                 dan(); 
  124.                 she(); 
  125.                 return; 
  126.             }else if(sind[sc-1]>hgn*sgn-hgn){//撞墙 
  127.                 gameover(); 
  128.                 return; 
  129.             } 
  130.             for(var i=0;i
  131.                 if(i==sc-1){ 
  132.                     sind[i]=sind[i]+hgn; 
  133.                     she(); 
  134.                     return; 
  135.                 } 
  136.                 sind[i]=sind[i+1]; 
  137.             } 
  138.         }else if(fx=="zuo"){ 
  139.             if(sind[sc-1]-1==dan_ind){//吃胆 
  140.                 scsc=sc+1; 
  141.                 sind[sc-1]=dan_ind; 
  142.                 dan(); 
  143.                 she(); 
  144.                 return; 
  145.             }else if((sind[sc-1])%hgn==0){//撞墙 
  146.                 gameover(); 
  147.                 return; 
  148.             } 
  149.             for(var i=0;i
  150.                 if(i==sc-1){ 
  151.                     sind[i]=sind[i]-1; 
  152.                     she(); 
  153.                     return; 
  154.                 } 
  155.                 sind[i]=sind[i+1]; 
  156.             } 
  157.         }else if(fx=="shang"){ 
  158.             if(sind[sc-1]-hgn==dan_ind){//吃胆 
  159.                 scsc=sc+1; 
  160.                 sind[sc-1]=dan_ind; 
  161.                 dan(); 
  162.                 she(); 
  163.                 return; 
  164.             }else if(sind[sc-1]
  165.                 gameover(); 
  166.                 return; 
  167.             } 
  168.             for(var i=0;i
  169.                 if(i==sc-1){ 
  170.                     sind[i]=sind[i]-hgn; 
  171.                     she(); 
  172.                     return; 
  173.                 } 
  174.                 sind[i]=sind[i+1]; 
  175.             } 
  176.         }else{ 
  177.             return; 
  178.         } 
  179.          
  180.          
  181.     } 
  182.      
  183.      
  184.      
  185.      
  186.     //判断是否吃到胆 
  187.     function isdan(num){ 
  188.         if(num==dan_ind){ 
  189.             scsc=sc+1; 
  190.             sind[sc-1]=num; 
  191.             dan(); 
  192.         } 
  193.     } 
  194.      
  195.      
  196.     //按键 
  197.     $(document).keydown(function(event){ 
  198.         var down_num = event.which; 
  199.         var fx = null; 
  200.         if(down_num==37){//左 
  201.             fx = "zuo"; 
  202.         }else if(down_num==38){//上 
  203.             fx = "shang"; 
  204.         }else if(down_num==40){//下 
  205.             fx = "xia"; 
  206.         }else if(down_num==39){//右 
  207.             fx = "you"; 
  208.         }else if(down_num==32){ 
  209.             stopmove(); 
  210.         } 
  211.          
  212.         //需判断能否点击 
  213.         if(fxcur=="shang"&&fx=="xia"||fxcur=="xia"&&fx=="shang"||fxcur=="zuo"&&fx=="you"||fxcur=="you"&&fx=="zuo"){ 
  214.             return; 
  215.         }else{ 
  216.             fxfxcur = fx; 
  217.         } 
  218.          
  219.     }); 
  220.      
  221.     //绘胆 
  222.     function dan(){ 
  223.         //需判断生成胆是否在蛇索引上 
  224.          
  225.         dan_ind = parseInt(hgn*sgn*Math.random()-1); 
  226.         for(var i=0;i
  227.             if(dan_ind==sind[i]){ 
  228.                 dan(); 
  229.                 return; 
  230.             } 
  231.         } 
  232.          
  233.         $("ul li").removeClass("dan"); 
  234.         $("ul li:eq("+dan_ind+")").addClass("dan"); 
  235.     } 
  236.      
  237.      
  238.      
  239. }) 
  240.  
  241.  
  242.  
  243.  
  244.  
  245. 方向键控制方向空格键暂停
 
  •  
    •  
     
  •  
    •  
  •  
  •  
  •  

    •  


    当前题目：jQuery写个贪吃蛇
    新闻来源：http://cdxtjz.cn/article/ghpgis.html

    其他资讯