佚名通过本文主要向大家介绍了js跑酷游戏代码碰撞检测逻辑错误，球在没到wall里就弹出信息，代码里已表明地点等相关知识,希望对您有所帮助,也希望大家支持linkedu.com www.linkedu.com
问题： js跑酷游戏代码碰撞检测逻辑错误，球在没到wall里就弹出信息，代码里已表明地点
描述:
解决方案1:
描述:
<!DOCTYPE html>
<html>
<head>
<title></title>
<style type="text/css">
*{margin: 0px;padding: 0px}
canvas{background: #eee;display: block;margin: 0,auto;}
</style>
</head>
<body>
<canvas width="800" height="320">
</canvas>
<script type="text/javascript">
var canvas=document.getElementById('myCanvas');
var ctx=canvas.getContext('2d');
var width=10
var height=80
var rectX=[100,300,500]
var radius=10
var dx=2
var ballX=10
var ballY=canvas.height-radius
var dy=200
function drawall(){
for(var a=0;a<10;a++){
ctx.beginPath();
ctx.rect(rectX[a],canvas.height-height,width,height);
ctx.fillStyle='blue'
ctx.fill();
ctx.closePath();
}
}
function drawBall(){
ctx.beginPath();
ctx.arc(ballX,ballY,radius,0,Math.PI*2)
ctx.fill();
ctx.closePath();
}
function draw() {
ctx.clearRect(0, 0, canvas.width, canvas.height);
drawall();
drawBall();
//此处未成功，一开始就跳出
if(100<ballX+radius<100+width){
alert(you loase)
}
ballX=ballX+dx
}
document.addEventListener('keydown',keydownHandler,false)
document.addEventListener('keyup',keyupHandler,false)
function keydownHandler(e){
if(e.keyCode==32){
ballY-=dy
}
}
function keyupHandler(e){
if(e.keyCode==32){
ballY+=dy;
}
}
setInterval(draw,10);
</script>
</body>
</html>解决方案1:
你这里写错了，写区间不能这样写的
100<ballX+radius<100+width要表示大于什么并且小于什么，应该这样写
ballX+radius > 100 && ballX+radius < 100 + width