javascript - jQuery Tic Tac Toe 问题

Question

jQuery 新手。不确定为什么此代码无法显示胜利...

我有 2 个点击函数，一个用于 X，另一个用于 O

然后我有一个 checkBoard 函数，它通过名为 board 的数组检查名为 Wins 的数组是否有匹配的胜利组合。

该表堆叠在 jquery 代码之上。我首先粘贴了 jquery，因为我相信这就是问题所在，因为我可以用值填充方 block ，但它没有显示胜利。

这是代码:

<script>
        var count = 0

        $('td').on('click', function (){
         if(count % 2 === 0){
            $(this).text("X");
        } else {
            $(this).text("O");
        }
            count++
            checkBoard();
        });

        function checkBoard(){

            var wins = [[$("#0"),$("#1"),$("#2")], [$("#3"),$("#4"),$("#5")], [$("#6"),$("#7"),$("#8")], [$("#0"),$("#3"),$("#6")], [$("#1"),$("#4"),$("#7")], [$("#2"),$("#5"),$("#8")], [$("#0"),$("#4"),$("#8")], [$("#6"),$("#4"),$("#2")]]
            var board = [[$("#0"), $("#1"), $("#2")], [$("#3"),$("#4"),$("#5")], [$("#6"), $("#7"), $("#8")]]  


            for(w in this.wins){
             var pattern = this.wins[w];
                var checkPattern = this.board[pattern[0]] + this.board[pattern[1]] + this.board[pattern[2]];
                    if (checkPattern = ["X","X","X"]) {
                        return "X Wins!";
                        console.log("X");
                    } else if (checkPattern = ["O","O","O"]) {
                        return "O Wins!";
                        console.log("O");
                    }
            }
        }

        </script>

<table> 
        <tr>
            <td id="0"></td>
            <td id="1"></td>
            <td id="2"></td>
        </tr>
        <tr>
            <td id="3"></td>
            <td id="4"></td>
            <td id="5"></td>
        </tr>
        <tr>
            <td id="6"></td>
            <td id="7"></td>
            <td id="8"></td>
        </tr>
    </table>

td {
    width: 100px;
    height: 100px;
    border: 2px solid black;
    font-size: 5em;
    text-align: center;
}

Answer 1

看起来问题出在你的 for 循环中。您甚至不需要 board 数组，只需检查 Wins 数组中每个 jQuery 对象的值即可查看是否有胜利。

当仅使用 1 个等号时，您将 checkPattern 分配给 if 语句中的数组。另外，使用 jQuery 选择器 $(ID) 返回一个 jQuery 对象，而不是标记中的内容。

试试这个:

for (var i=0; i<wins.length; i++) {
                var w = wins[i];
                var checkXwin = w[0].text() == "X" && w[1].text() == "X" && w[2].text() == "X";
                var checkOwin = w[0].text() == "O" && w[1].text() == "O" && w[2].text() == "O";
                if (checkXwin) {
                    console.log("X");
                    return "X Wins!";
                } else if (checkOwin) {
                    console.log("O");
                    return "O Wins!";
                }
            }

编辑

如果我使用普通的 for 循环而不是增强的循环，我就能让它工作。