jQuery中奇怪的变量变化

Weird variable change in jQuery

本文关键字:变量 变化 jQuery      更新时间:2023-09-26

我正在运行这个JS/jQuery代码,以制作一个简单的"井字棋"游戏,我已经在纯Javascript中完成了。我放置了一些console.log函数进行检查,当我单击任何按钮时,当函数启动时,我意识到在循环之后,即使循环内的值是正确的,也有几个剩下的值是错误的(1到9)。我被卡在这儿了,有人能帮我一下吗?

var player = "O", tabo = [[1,2,3],[4,5,6],[7,8,9]], i = 0, j = 0;

$('button').click(function () {
    var id = this.id;
    if($('#' + id).text() !== "O" && $('#' + id).text() !== "X") {
        if (player === "O") {
            $('#' + id).text("O");
            player = "X";
        }else{
            $('#' + id).text("X");
            player = "O";
        }
    }else{
        alert("Case déjà prise !");
    }
    for (i = 0; i < 3; i++) {
        for (j = 0; j < 3; j++) {
            tabo[i,j] = $("#case" + (j + 1 + (3 * i))).text();
            console.log(tabo[i,j]);
        }
    }
    console.log(tabo[0,0]);
    console.log(tabo[1,0]);
    console.log(tabo[2,1]);
    console.log(tabo[1,1]);
    console.log(tabo[2,0]);
    console.log((tabo[0,0] === tabo[1,0]) +"1");
    console.log((tabo[0,0] === tabo[2,0]) +"2");
    console.log((tabo[1,1] === tabo[0,1]) +"3");
    console.log((tabo[1,1] === tabo[2,1]) +"4");

    if (((tabo[1,1] === tabo [0,0]) && (tabo[1,1] === tabo[2,2]))||
        ((tabo[1,1] === tabo [0,2]) && (tabo[1,1] === tabo[2,0]))||
        ((tabo[0,0] === tabo [0,1]) && (tabo[0,0] === tabo[0,2]))||
        ((tabo[0,0] === tabo [1,0]) && (tabo[0,0] === tabo[2,0]))||
        ((tabo[2,2] === tabo [2,0]) && (tabo[2,2] === tabo[2,1]))||
        ((tabo[2,2] === tabo [0,2]) && (tabo[1,1] === tabo[1,2]))||
        ((tabo[1,1] === tabo [1,0]) && (tabo[1,1] === tabo[1,2]))||
        ((tabo[1,1] === tabo [0,1]) && (tabo[1,1] === tabo[2,1]))) {
        alert(player + " a gagné !!!");
        //location.reload(true);
    }
});

这是相关的HTML文档

    <!doctype html>
    <html>
        <head>
            <meta charset="utf-8">
            <title>jQuery</title>
            <link rel="stylesheet" href="../css/styles_jQuery.css" />
        </head>
        <body>
            <table>
                <tr id="line1">
                    <td><button id="case1">1</button></td>
                    <td><button id="case2">2</button></td>
                    <td><button id="case3">3</button></td>
                </tr>
                <tr id="line2">
                    <td><button id="case4">4</button></td>
                    <td><button id="case5">5</button></td>
                    <td><button id="case6">6</button></td>
                </tr>
                <tr id="line3">
                    <td><button id="case7">7</button></td>
                    <td><button id="case8">8</button></td>
                    <td><button id="case9">9</button></td>
                </tr>
            </table>
            <script src="http://code.jquery.com/jquery-3.1.0.min.js">
            </script>
            <script src="../js/jQuery.js"></script>
        </body>
    </html>

和简单的CSS脚本

    body{
        background-color: aqua;
    }
    button{
        height: 50px;
        width: 50px;
    }

基于逗号操作符,下面的指令具有相同的结果

tabo[0,0] == tabo[0] // true
tabo[1,0] == tabo[0] // true
tabo[2,0] == tabo[0] // true

逗号操作符计算它的每个操作数(从左到)右)并返回最后一个操作数的值。

我想你要检查tabo[i][j]