JavaScript井字游戏

Question

我正在尝试构建一个井字游戏，但它不起作用，我的意思是当我单击游戏板时，我希望游戏启动并具有相应的功能。 现在的问题是，我希望该游戏成为人机对战，并且机器部件（功能AI（））无法正常运行。

这是链接codepen

我将所有功能都包含在“游戏”函数（游戏（））中，当用户单击js文件末尾的游戏面板时，该函数应运行。

只要尝试玩游戏，您就会理解我在说什么-怪异的行为，我scratch着眼睛看，仍然被困住。

如果有人可以帮助我，我将不胜感激。 谢谢。

function game(){
    symbDisp();
    winCheck();
    turns += 1;
    if (gameEnd == false && turns % 2 == 0) {
        AI();
        winCheck();
        turns += 1;
    }
}

Answer 1

AI（）函数起作用（或多或少）。 实际上，只有AI在玩游戏。 播放器移动不起作用，因为您没有告诉symbDisp（）函数单击了哪个正方形（“ this”是指文档，而不是正方形）

您可以将事件处理程序更改为窗体

$('.square').on('click', function() {
    game($(this));
});

在此匿名函数内，它指的是正方形，因为这是事件处理程序绑定到的元素。

现在，您还需要通过更改game（）和symbDisp（）函数以将该元素作为参数并在symbDisp（）内部使用，来稍微传递该正方形元素。

例如：

function game(elem){
    symbDisp(elem);
    //more stuff

function symbDisp(elem) {
    if(elem.text()==='') {
    //more stuff

您的游戏中还有其他错误，但我将留给您解决。

Answer 2

首先symbDisp正在接收window为this而不是正确的td 。

将第10行更改为

$('.square').on('click', function() { game(this) } );

因为换你要通过this来的子功能。 因此，请进行以下更改：

124:  function game(ths){
125:    
126:   symbDisp(ths);

然后将symbDisp更改为：

function symbDisp (ths) {
  if($(ths).text()==='') {
     $(ths).text(pTurn);
      if(pTurn == player){
        pTurn =comp;
      }else{
        pTurn=player;
      }
    }
}

还有另一个错误：pTurn首次到达symbDisp函数时未定义。 因此，将userIcon更改为：

  function userIcon() {
    if($(this).attr("id")=="x"){
      player = pTurn ="X";
      comp ="O";
    } else if($(this).attr("id")=="o"){
      player = pTurn ="O";
      comp ="X";
    }
    $('#user').fadeOut(1000);
  }

看到我在设置播放器时设置了pTurn。

而已。 现在应该可以工作了。 我在这里分叉了一个工作版本：

http://codepen.io/anon/pen/oxPyej

希望能帮助到你