Question

我正在学习JavaScript，我想我可以做一个井字游戏。

我有一个名为displayMessage()的函数，该函数可更改<p>标记内的文本。

function displayMessage(message) {
turn_p.innerHTML = message}

每当转弯时，我都会调用此函数，它会按预期工作。

function setNextPlayerTurn(currentPlayer) {
currentPlayer === "X" ? player = "O" : player = "X"
displayMessage(`${player}'s turn!`)}

但是当游戏结束以显示获胜者时我将其命名为

function endGame() {
cells.forEach((cell) => {
    cell.removeEventListener('click', turnClick, false);
})
displayMessage(`${player} player Won!`)}

endGame()函数由另一个名为checkWin()的函数调用。如果checkWin()为真，则调用endGame()。

function checkWin() {
if (checkFirstRow() ||
    checkSecondRow() ||
    checkThirdtRow() ||
    checkFirstColumn() ||
    checkSecondColumn() ||
    checkThirdColumn() ||
    checkMainDiagonal() ||
    checkSecondaryDiagonal() == true) {
    endGame()
}}

我该怎么做才能解决此问题？

完整代码：https://jsfiddle.net/yrgs16av/

Answer 1

就像@Robin Zigmond所说的那样，问题在于它无论如何都立即转到下一个回合-包括将消息设置为下一个回合。

我做了一些修改，就可以了。

    function turn(squareId) {
        //code...
        checkWinAndDraw();
        if (gameEnded != true) {
            setNextPlayerTurn(player);
        }
}

        function checkWinAndDraw() {
        if (//condition)
        } else {
            checkDraw();
        }}

        function checkDraw() {
        if (board.every(square => square == 'X' || square == 'O')) {
            displayMessage(`It's a Draw!`);
            gameEnded = true;
        }
    }

    function endGame() {
        //code...
        displayMessage(`${player} player Won!`)
        gameEnded = true;
    }

内部文字不变

1 个答案: