0

我正在开发一个 HTML5 Runner 游戏，该对象连续运行，并且在鼠标事件“单击”时，他跳了起来。然后我在游戏中添加了一个障碍并检测到碰撞，但它不能正常工作。问题是，当障碍物与正在运行的物体发生一次碰撞并检测到碰撞时，清除所有物体，然后在画布上重新绘制障碍物，但随着障碍物一次又一次地碰撞，物体障碍物的速度变得越来越快......:(问题是如何克服它吗？这里是代码：

function clearHurdle(){

    h.clearRect(100,hy,160,250);
    //if(hx==paiX||hy==paiY){
    bl= new Image();
    bl.onload= function(){
        h.drawImage(bl,100,hy-20,160,250);
    };
    bl.src= "blast.png";
    setTimeout(function(){
    h.clearRect(100,hy-20,160,250);
    show_char=0;
    clearAll();
    //drawpai();
    hurdle();   
    },100);

}

function hurdle(){

    if(hx>(paiX-2) && hx<(paiX+2) && hy>(paiY-2) && hy<(paiY+2)){
        console.log(hx +'===='+(paiX-2));
        clearHurdle();
        hx=1360;    
    }

    h.clearRect(hx,hy,170,250);

    var img = new Image();

    img.onload= function(){
        h.drawImage(img,hx,hy,170,250);
    }

    img.src="hurdle.png";
    hx-= 4.5;

    if(hx>-400){
        setTimeout(hurdle,1000/60);
    }

    show_char=1;
}
4

1 回答 1

1

据我所知，随着游戏的进行，速度增加的问题是由于在您的clearHurdle函数中创建了重复的 setTimeouts。你拥有它的方式它在第一次运行时工作，但是因为 setTimeout 调用该函数hurdle（然后clearHurdle在一个无限持续的循环中回调），它添加了第二个、第三个、第四个等要运行的 setTimeout。

如果这确实是您的问题，您可以通过在clearHurdle函数中为 setTimeout 声明一个变量名称来解决它，使用格式var varName = setTimeout(function(){ ...Code Here... });并使用clearTimeout("varName")每次重置 setTimeout（除非您只是简单地重组程序以不需要函数相互调用）

于 2013-07-27T23:52:25.470 回答