Question

我正在切换布尔变量“userTurn”。有两个函数可以设置“userTurn”的值：

runGame（），在播放当前回合中的最后一个声音后将“userTurn”设置为true。
buttonClick（），只有在“userTurn”为true时才会执行。用户成功复制当前模式后，或者如果用户犯了错误，buttonClick会将“userTurn”设置为false。

我正在评估点击事件中的条件语句中“userTurn”的值。
```
function runGame(){
    if(isOn===true){
        userTurn = false;
        count();
        playPattern(order, index);
        if(index===counter-1&&userTurn===false){
            userTurn=true;
            clearInterval(play);
            buzz = setTimeout(buzzer, 10000);
        }else{
            index++;
        } 
    } else {
        clearInterval(play);
        clearTimeout(buzz);
    }
}
```
用户成功复制当前模式后，或者如果用户犯了错误，“userTurn”设置为false。我遇到的问题是，在“userTurn”设置为false后，条件语句中的代码仍在执行。目标是“.quarter”只有在“userTurn”为真时才可以点击。为什么即使“userTurn”为假，单击“。quarter”时buttonClick（）函数仍在执行？

以下是设置“userTurn”值的两个函数：

runGame（）：

function buttonClick(color){
    var yellowSound = document.getElementById("horseSound");
    var redSound = document.getElementById("endFx");
    var greenSound = document.getElementById("westernRicochet");
    var blueSound = document.getElementById("robotBlip");
    $("#red").mousedown(function(){
        $("#red").css("background-color", "#ff4d4d");
        redSound.play();
    });
    $("#red").mouseup(function(){
        $("#red").css("background-color", "#ff0000");
        redSound.pause();
    });
    $("#blue").mousedown(function(){
        $("#blue").css("background-color", "#0000e6");
        blueSound.play();
    });
    $("#blue").mouseup(function(){
        $("#blue").css("background-color", "#000099");
        blueSound.pause();
    });
    $("#green").mousedown(function(){
        $("#green").css("background-color", "#00e600");
        greenSound.play();
    });
    $("#green").mouseup(function(){
        $("#green").css("background-color", "#009900");
        greenSound.pause();
    });
    $("#yellow").mousedown(function(){
        $("#yellow").css("background-color", "#ffff4d");
        yellowSound.play();
    });
    $("#yellow").mouseup(function(){
        $("#yellow").css("background-color", "#ffff00");
        yellowSound.pause();
    });
    if(color===order[compareIndex]){
        userPattern.push(color);
        console.log(userPattern, "match");
        buzz = setTimeout(buzzer, 10000);
        compareIndex++;
        if(userPattern.length===counter){
            userTurn=false;
            compareIndex=0;
            index=0;
            counter++;
            count();
            userPattern.length=0;
            play = setInterval(runGame, 2000);
            clearTimeout(buzz);
        }
    } else {
        userTurn=false;
        console.log('don\'t match');
        clearTimeout(buzz);
        index=0;
        compareIndex = 0;
        userPattern.length=0;
        buzz = setTimeout(buzzer, 1);
    }
}

2.buttonClick（）：

GROUP BY

在去CODEPEN之前降低你的体积！这是tf.py_func的链接。要开始游戏，请单击“开关”，然后单击“开始”。时间很慢所以你必须等待模式播放，然后按照播放顺序单击按钮。播放第一个声音后会出现此问题。从这一点开始，即使游戏正在播放模式并且“userTurn”为假，用户所做的任何点击都会播放声音并点亮按钮。另外要注意的是，这仍然是一项正在进行中的工作，还有一些我正在处理的其他错误，例如用户制作的第一个转弯不会点亮或播放声音，但选择被推入正确的阵列，游戏将根据您的选择正确进行。我知道这是很多信息，但我坚持这一点所以任何反馈将非常感激。谢谢！

Answer 1

您正在使用buttonClick来处理点击按钮，但在buttonClick内，您还为每个按钮设置了mouseup和mousedown个事件侦听器。由于各个按钮都有自己的mouseup和mousedown侦听器，无论是否再次调用buttonClick，都会发生事件。

您必须检查每个事件处理程序中userTurn是否true以防止它们被触发。此外，最好将它们设置在buttonClick之外，这样每次调用buttonClick时都不会添加新的侦听器。

在click事件的条件语句中计算的Toggled布尔变量

1 个答案: