井字没有循环 - jQuery.

Question

我有这段代码，我试图弄清楚为什么我的 if 语句不起作用。现在，我只想检查前三个框是否为"X"，以及它们是否要宣布获胜者。

let player1 = "X";
let player2 = "O";
let turn = "X";
let box1 = $('.box1').val();
let box2 = $('.box2').val();
let box3 = $('.box3').val();
let paragraph = $('p');
let everyBox = $('.everyBox');
everyBox.on('click', event => {
  if ($(event.currentTarget).attr('disabled')) {
    return;
  }
  if (turn == "X") {
    $(event.currentTarget).append(player1);
    turn = "O";
  } else {
    $(event.currentTarget).append(player2);
    turn = "X";
  }
  $(event.currentTarget).attr('disabled', true);
  myFunction();
});
function myFunction() {
  if (box1 == player1 && box2 == player1 && box3 == player1) {
    paragraph.text('player1 wins!').
  }

Answer 1

你的变量box1、box2和box3不是对值的动态引用。它们在分配时是值。

您可以通过将这些行移动到myFunction功能块中来更正脚本行为：

let player1 = "X";
let player2 = "O";
let turn = "X";
let paragraph = $('p');
let everyBox = $('.everyBox');
everyBox.on('click', event=>{
    if ($(event.currentTarget).attr('disabled')) {
        return;
    }
    if(turn=="X"){
        $(event.currentTarget).append(player1);
        turn="O";
    }
    else{
        $(event.currentTarget).append(player2);
        turn="X";
    }
    $(event.currentTarget).attr('disabled', true);
    myFunction();
});
function myFunction(){
    let box1 = $('.box1').val();
    let box2 = $('.box2').val();
    let box3 = $('.box3').val();
    if(box1 == player1 && box2 == player1 && box3 == player1){
        paragraph.text('player1 wins!').
    }
}