<span style="font-size:18px;">如有问题欢迎询问,指导!!
<script type="text/javascript" src="jquery-2.1.3.js"></script>
<script type="text/javascript">
var x = 0;
var y = 0;
var id = 0;
var code=40;
var size=18;
function start(event){
//上38 左37 右39 下40
code=event.keyCode;
}
function run(){
var rq = $("tr");
if(code==37){
x--;
}
if(code==38){
y--;
}
if(code==39){
x++;
}
if(code==40){
y++;
}
$("div").html("x="+x+" <br/> y="+y);
//判断是否加长
var html = $($(rq.get(y)).children().get(x)).attr("class");
if(html=="cla"){
size++;
}
//判断是否游戏结束;
var h = $($(rq.get(y)).children().get(x)).attr("id");
if(h!=""){
$("table").html("GAME OVER!");
return;
}
//控制变色;
$($(rq.get(y)).children().get(x)).attr("class","cla");//设置其class属性使他具有相应的背景颜色;
$($(rq.get(y)).children().get(x)).attr("id",id);//设置id属性供以后计算设身体长度时使用;
if($(".cla").size()>size){//条件满足后移除舍身的class属性及id属性;
$("#"+(id-size)).attr("class","");
$("#"+(id-size)).attr("id","");
}
id++;
setTimeout("run()",200);
}
//使用随机数随机产生有色块;
function create(){
var rq = $("tr");
var s = Math.round(Math.random()*50);
var ss = Math.round(Math.random()*50);
$($(rq.get(s)).children().get(ss)).attr("class","cla");
setTimeout("create();",2000);
}
</script>
<style>
table{
margin: auto;
background: skyblue;
}
table td{
width:10px;
height: 10px;
}
.cla{
background:red;
}
</style>
</head>
<body οnkeydοwn="start(event)" οnclick="run();create()">
<table id="tabl">
<c:forEach begin="1" end="50">//forEatch循环产生表格;
<tr>
<c:forEach begin="1" end="50">
<td id=""></td>//统一设置id;
</c:forEach>
</tr>
</c:forEach>
</table>
<div></div>
</body>
</html></span>
jsp贪吃蛇源码
最新推荐文章于 2020-01-31 17:28:28 发布