Question

我正在编写一个Tic-Tac-Toe游戏，该游戏调用一个API，允许用户登录/注册，创建游戏，访问已保存的正在进行的游戏，与他人一起玩游戏等.I＆＃39;我目前在访问已保存的游戏时遇到很多麻烦。当你单击带有ID＆＃34; show＆＃34;的HTML元素时，我想要发生两件事：我应该看到＆＃34;结果＆＃34; div填充了检索到的JSON，我应该直观地看到游戏中当前玩家所在的棋盘格（编号为0到8）。

目前，我需要点击＆＃34;显示＆＃34;两次以便发生这两件事。在第一次单击时，我看到在＆＃34;结果＆＃34;中呈现的JSON。 div（基本上_displayInProgressGame / GameAJAX.displayInProgressGame中的所有内容都会发生）。在第二次单击时，将更新电路板HTML（displayInProgressGameUI）。

这是我的AJAX - 此代码的目标是在#result div中显示检索到的JSON游戏数据，并设置我的本地棋盘数据（如果我还没有开始游戏的话），将只是一个包含9个空字符串的数组）等于JSON中的数据板数据（例如：[＆＃39; X＆＃39;，＆＃39; O＆＃39;，＆＃39;＆＃39;，＆＃39;＆＃39;，＆＃39;＆＃39;，＆＃39;＆＃39;，＆＃39; X＆＃39;，＆＃39;＆＃39;，＆＃39;＆＃ 39]）：

var _displayInProgressGame = function(){
  $.ajax(sa + '/games/' + $('#show-input').val(), {
    dataType: 'json',
    method: 'GET',
    headers: {
      Authorization: 'Token token=' + $('#token').val()
    }
  }).done(function(data, textStatus, jqxhr){
    $('#result').val(JSON.stringify(data));
    for (var i = 0; i < (data.game.cells).length; i++) {
      if (data.game.cells[i]) {
        Game.addToBoard(data.game.cells[i],i);
      }
    }
  }).fail(function(jqxhr, textStatus, errorThrown){
    $('#result').val('show failed');
  });
  };

这是显示正在进行的游戏的另一半的JS代码。这段代码调用上面描述的函数，根据我的本地板数据（我上面描述的数组）呈现板HTML，检查第三个逻辑JS文件（你看到的所有内容都以＆＃34开头;游戏。＆＃34;来了从第三个文件）看看游戏是否结束（检查领带或胜利），并做一些其他的事情，如增加到目前为止所做的移动计数。

var displayInProgressGameUI = function(){
  GameAJAX.displayInProgressGame();
  Game.board().forEach(function(cell){
    if (cell) {
      Game.incrementMoveCount();
    }
  });
  if (Game.isGameOver()) {
    $prompt.show();
    $prompt.html('This game has already ended! Click New Game to play another.');
    gameOverUI();
  }
  $('#0').text(Game.board()[0]);
  $('#1').text(Game.board()[1]);
  $('#2').text(Game.board()[2]);
  $('#3').text(Game.board()[3]);
  $('#4').text(Game.board()[4]);
  $('#5').text(Game.board()[5]);
  $('#6').text(Game.board()[6]);
  $('#7').text(Game.board()[7]);
  $('#8').text(Game.board()[8]);
};

$('#show').on('click', displayInProgressGameUI);

我几乎可以肯定这与调用所有内容的顺序有关，或者我的displayInProgressGameUI函数中的if语句搞乱了。

提前谢谢！

需要两次单击元素才能执行两个点击处理程序

0 个答案: