Question

HTML：

<table border="1" cellpadding="4">
    <tbody>
        <tr>
            <td id="c1">-</td>
            <td id="c2">-</td>
            <td id="c3">-</td>
        </tr>
        <tr>
            <td id="c4">-</td>
            <td id="c5">-</td>
            <td id="c6">-</td>
        </tr>
        <tr>
            <td id="c7">-</td>
            <td id="c8">-</td>
            <td id="c9">-</td>
        </tr>
    </tbody>
</table>

使用Javascript：

function ticTac(){                                      
  if (this.innerHTML == "-"){                                                   
    this.innerHTML = "X";                                       
  }                                     
}                                       
document.getElementById("c1").onclick = ticTac;                                     
document.getElementById("c2").onclick = ticTac;                                     
document.getElementById("c3").onclick = ticTac;                                     
document.getElementById("c4").onclick = ticTac;                                     
document.getElementById("c5").onclick = ticTac;                                     
document.getElementById("c6").onclick = ticTac;                                     
document.getElementById("c7").onclick = ticTac;                                     
document.getElementById("c8").onclick = ticTac;                                     
document.getElementById("c9").onclick = ticTac;

只是一个功能问题，如何创建一个＆＃34; O＆＃34;，它在X和O之间轮流并且不会超过表中现有的X或O？

Answer 1

只需设置一个存储当前播放器的全局变量，并在每次转弯后更改播放器：

var currentPlayer = "X";
function ticTac(){                                      
  if (this.innerHTML == "-") {                                                   
    this.innerHTML = currentPlayer;
    currentPlayer = currentPlayer == "X" ? "O" : "X";                           
  }                                     
}                                       
document.getElementById("c1").onclick = ticTac;                                     
document.getElementById("c2").onclick = ticTac;                                     
document.getElementById("c3").onclick = ticTac;                                     
document.getElementById("c4").onclick = ticTac;                                     
document.getElementById("c5").onclick = ticTac;                                     
document.getElementById("c6").onclick = ticTac;                                     
document.getElementById("c7").onclick = ticTac;                                     
document.getElementById("c8").onclick = ticTac;                                     
document.getElementById("c9").onclick = ticTac;

Answer 2

我在这里放的代码是我几周前在互联网上看到的，当时我正在制作我的游戏，我希望它能帮到你

我从这里得到了这个game tic tac toe

这对您有帮助，请阅读with all explanation

var State = function（old）{

/*
 * public : the player who has the turn to player
 */
this.turn = "";

/*
 * public : the number of moves of the AI player
 */
this.oMovesCount = 0;

/*
 * public : the result of the game in this State
 */
this.result = "still running";

/*
 * public : the board configuration in this state
 */
this.board = [];

/* Begin Object Construction */
if(typeof old !== "undefined") {
    // if the state is constructed using a copy of another state
    var len = old.board.length;
    this.board = new Array(len);
    for(var itr = 0 ; itr < len ; itr++) {
        this.board[itr] = old.board[itr];
    }

    this.oMovesCount = old.oMovesCount;
    this.result = old.result;
    this.turn = old.turn;
}
/* End Object Construction */

/*
 * public : advances the turn in a the state
 */
this.advanceTurn = function() {
    this.turn = this.turn === "X" ? "O" : "X";
}

/*
 * public function that enumerates the empty cells in state
 * @return [Array]: indices of all empty cells
 */
this.emptyCells = function() {
    var indxs = [];
    for(var itr = 0; itr < 9 ; itr++) {
        if(this.board[itr] === "E") {
            indxs.push(itr);
        }
    }
    return indxs;
}

/*
 * public  function that checks if the state is a terminal state or not
 * the state result is updated to reflect the result of the game
 * @returns [Boolean]: true if it's terminal, false otherwise
 */
this.isTerminal = function() {
    var B = this.board;

    //check rows
    for(var i = 0; i <= 6; i = i + 3) {
        if(B[i] !== "E" && B[i] === B[i + 1] && B[i + 1] == B[i + 2]) {
            this.result = B[i] + "-won"; //update the state result
            return true;
        }
    }

    //check columns
    for(var i = 0; i <= 2 ; i++) {
        if(B[i] !== "E" && B[i] === B[i + 3] && B[i + 3] === B[i + 6]) {
            this.result = B[i] + "-won"; //update the state result
            return true;
        }
    }

    //check diagonals
    for(var i = 0, j = 4; i <= 2 ; i = i + 2, j = j - 2) {
        if(B[i] !== "E" && B[i] == B[i + j] && B[i + j] === B[i + 2*j]) {
            this.result = B[i] + "-won"; //update the state result
            return true;
        }
    }

    var available = this.emptyCells();
    if(available.length == 0) {
        //the game is draw
        this.result = "draw"; //update the state result
        return true;
    }
    else {
        return false;
    }
};

};

Answer 3

只需要一个布尔运算符并在转弯后将其更改为

<include
    domain="database"
    path="data.db" />

Answer 4

一个简单的方法是：

请注意：在这种情况下，＆＃39; o＆＃39;玩家总是优先移动作为第一个玩家（但你可以简单地改变它或要求用户选择哪个是第一个）

的 JS ：

{ "Version": "2012-10-17", "Statement": [ { "Effect": "Permission", "Action": [ "execute-api:Invoke" ], "Resource": [ "arn:aws:execute-api:region:account-id:api-id/stage/METHOD_HTTP_VERB/resource-path" ] } ] }

jsfidle

Answer 5

在每个td标签中添加一个按钮，并在单击一次后将其禁用。这样就可以了。

document.getElementById(id).disabled=true;

有关更多信息，请按照我的Github中的代码进行操作。

https://github.com/NaniBlaze/TICTACTOE

TicTacToe - javascript

5 个答案: