Question

我正在制作一个tic tac toe游戏来教自己关于画布元素，但转向计数器似乎没有增加。任何帮助将不胜感激。

function turn() {
    var turnNum = 1;
    while (turnNum <= 9) {
        alert(turnNum % 2);
        showCurrent(turnNum);

        $(canvas).click(function(event) {
            // jQuery would normalize the event
            mouse = getMouse(event);
            //now you can use the x and y positions

            if (turnNum % 2) {
                drawX(Math.floor(mouse.y / 100), Math.floor(mouse.x / 100));
            } else {
                drawO(Math.floor(mouse.y / 100), Math.floor(mouse.x / 100));
            }
        });

        turnNum = turnNum++;
    }
}

Answer 1

你的问题可能是这个语句turnNum = turnNum++;它是一个后增量运算符，它意味着它分配然后递增但是分配总是将它设置回1本身，只需使用turnNum++或者你可能意味着使用turnNum += 1

除了另一个问题，在循环中你将click事件绑定到canvas并使用内部的共享变量turnNum，这意味着当你的click事件运行时它总是拥有最后一个值，似乎您将同一个点击事件多次绑定到同一个canvas

Answer 2

而不是使用

turnNum = turnNum++;

请使用

turnNum++;

Answer 3

虽然关于如何你正在递增turnNum的答案都是正确的，但是当你这样做时，时会出现更为根本的问题。< / p>

您需要在点击事件期间更新此变量。而且你绝对不想一遍又一遍地重新绑定点击事件。所以你需要对这种逻辑进行一些重大的重组。

更新

这是重构代码的一种简单方法。移除turn功能，在drawGrid调用后，请改为使用此功能：

var turnNum = 0;
showCurrent(turnNum);

$(canvas).click(function(event) {
    if(turnNum++ < 9) {
        showCurrent(turnNum);
    }
    mouse = getMouse(event);
    //now you can use the x and y positions

    if(turnNum%2) {
        drawX(Math.floor(mouse.y/100),Math.floor(mouse.x/100));
    } else {
        drawO(Math.floor(mouse.y/100),Math.floor(mouse.x/100));
    }
});

有一个版本似乎在 JSFiddle 上正常运作。

Answer 4

您的事件绑定必须在循环之外（如果不是，您将多次绑定），应该是这样的：

var turnNum;
$(canvas).click(function(event) {
    // jQuery would normalize the event
    mouse = getMouse(event);
    //now you can use the x and y positions
    if (turnNum % 2) {
        drawX(Math.floor(mouse.y / 100), Math.floor(mouse.x / 100));
    } else {
        drawO(Math.floor(mouse.y / 100), Math.floor(mouse.x / 100));
    }
 });
function turn() {
   turnNum = 1;
   while (turnNum <= 9) {
      alert(turnNum % 2);
      showCurrent(turnNum);      
      turnNum++;
   }
}

请注意，我们取出了turnNum var，因此它可以访问但是事件侦听器。另外，你的turnNum增量是错误的。

希望这会有所帮助。干杯

Answer 5

http://www.w3schools.com/js/js_operators.asp

正如您在链接中看到的那样，++仅在分配变量后才增加变量。

执行：

turnNum = ++turnNum;

或者简单地说：

turnNum++;

我的代码中的变量似乎没有递增

5 个答案:

更新