Question

Javascript点击事件被添加到我的应用中的很多帧中。我需要点击事件只发生一次，而不是200帧。帧似乎相互堆叠，为每次点击添加更多帧。我怎样才能使它只发生一次？

以下是事件代码：

    function a(e){
        var x = e.clientX - ctx.canvas.offsetLeft;
        var y = e.clientY - ctx.canvas.offsetTop;

        if(x >= initialScreen.x && x <= initialScreen.x + initialScreen.width
            && y >= initialScreen.y && y <= initialScreen.y + initialScreen.height){
            ctx.canvas.removeEventListener('click',a,false);
            quit = true;
        }
        else if(x >= left.x && x <= left.x + left.width 
            && y >= left.y && y <= left.y + left.height){
            ctx.canvas.addEventListener('click', a, false);
            player.x += 5;
        }
    }

    // Add the click event using the previous function
    ctx.canvas.addEventListener('click', a, false);

Answer 1

使用标记指示画布是否已连线以侦听点击次数

var isListeningToClick;

然后使用该标志只切换一次开/关：

function a(e){
    var x = e.clientX - ctx.canvas.offsetLeft;
    var y = e.clientY - ctx.canvas.offsetTop;

    if(x >= initialScreen.x && x <= initialScreen.x + initialScreen.width
        && y >= initialScreen.y && y <= initialScreen.y + initialScreen.height){
        if(isListeningToClick){
            ctx.canvas.removeEventListener('click',a,false);
            isListeningToClick=false;
        }
        quit = true;
    }
    else if(x >= left.x && x <= left.x + left.width 
        && y >= left.y && y <= left.y + left.height){
        if(!isListeningToClick){
            ctx.canvas.addEventListener('click', a, false);
            isListeningToClick=true;
        }
        player.x += 5;
    }
}

// Add the click event using the previous function
ctx.canvas.addEventListener('click', a, false);
isListeningToClick=true;

Click事件发生在很多帧中

1 个答案: