Javascript Tic Tac Toe 游戏不会验证对 Angular 获胜者-6ren

Javascript Tic Tac Toe 游戏不会验证对 Angular 获胜者

转载作者：行者123 更新时间：2023-12-02 14:49:34

27

4

我创建了一个井字棋游戏，当您按下增加棋盘尺寸按钮时，它会动态增加棋盘尺寸，但它不会验证对 Angular 线胜利...我不知道从这里该去哪里...

javascript

$(document).ready(function() {
  var turn = 1;
  var number = 3;

  function addRow(i) {
    var table = document.getElementById('table');
    var newRow = table.insertRow();
    newRow.id = "row" + i;
    addCols(newRow);
  }

  function addCols(row) {
    for (var i = 1; i <= number; i++){
      addTd(i,number,row);
    }
  }

  function addTd(columnnumber,rownumber,row) {
    var newCol = document.createElement('td');
    newCol.id = "r" + rownumber + "col" + columnnumber;
    row.appendChild(newCol);
  }
  //creating one click event for each td
  $('td').one('click', function() {
    if (turn % 2 === 0) {
      $(this).html('O');
    } else {
    $(this).html('X');
  }
    turn++;
    checkWinnerTable();
  });

  $('button.in').on('click', function() {
    destroyBoard();
    number++;

    for (var i = 1; i <= number; i++){
      addRow(i);
    }

    function destroyBoard(){
      $('tr').remove();
    }

  });

  function checkWinnerTable() {
    //loop to check # of rows
    for (var i = 1; i <= number; i++){
      var row = document.getElementById('row' + i);
      //loop to check # of cols
      for (var j = 1; j <= number; j++) {
         var col = document.getElementById('r' + i + 'col' + j);
        checkValue(row);
      }
    }
  }
    function checkValue(row){
      var row_value = row.value;
      if (row_value === "X" && row_value === row) {
        alert("X wins");
      }
      else if (row_value === "O" && row_value === row){
         alert("O wins")
      }
    }
});

HTML

<!DOCTYPE html>
<html lang="en">
<head>

  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
  <script src = "tictactoe.js"></script>
  <link href='https://fonts.googleapis.com/css?family=Muli' rel='stylesheet' type='text/css'>
  <link rel = "stylesheet" type="text/css" href="tictactoe.css">

  <meta charset="UTF-8">
  <title>Tic tac toe</title>

</head>
<body>
  <h1> Tic - Tac - Toe </h1>
  <div class = "board-size-in">
    <button class = "in" type="button"> Click to increase board size </button>
  </div>
  <!-- <div class = "board-size-de">
  <button class = "de" type="button"> Click to decrease board size </button>
</div> -->
  <div class = "message">
  </div>
  <table id ="table" style="width:100%">
    <tr id= "row1">
      <td id= "r1col1"></td>
      <td id= "r1col2"></td>
      <td id= "r1col3"></td>
    </tr>

    <tr id="row2">
      <td id= "r2col1"></td>
      <td id= "r2col2"></td>
      <td id= "r2col3"></td>
    </tr>

    <tr id= "row3">
      <td id= "r3col1"></td>
      <td id= "r3col2"></td>
      <td id= "r3col3"></td>
    </tr>

  </table>

</body>
</html>

最佳答案

function addRow(i) {
  var table = document.getElementById('table');
  var newRow = table.insertRow();
  newRow.id = "row" + i;
  addCols(newRow, i);
}

function addCols(row, rowindex) {
  for (var i = 1; i <= number; i++){
    addTd(i,number,row, rowindex);
  }
}

function addTd(columnnumber,rownumber,row, rowindex) {
  var newCol = document.createElement('td');
  newCol.id = "r" + rowindex + "col" + columnnumber;
  row.appendChild(newCol);
...

我不确定这是唯一的问题，但如果您检查答案中的元素，您会发现 tds 的 ID 错误。例如，第 1 行的 td 为 r4col1，与第 2、3 和 4 行相同。我将索引添加为 addCols 上的参数，并将其传递给 addTd，因此现在至少 HTML 是正确的。

关于Javascript Tic Tac Toe 游戏不会验证对 Angular 获胜者，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/36292716/

27

4

0

文章推荐： javascript - "Object expected"尝试在 Javascript 上输入时间

文章推荐： javascript - 如何同时运行 Node 子进程

文章推荐： javascript - 递归Function.prototype.apply概念理解

c++ - C++ 中的 Tic-Tac-Toe 帮助，如何制作循环以便 Tic Tac Toe 游戏每次都会重复棋盘
我是初学者，所以我的代码很乱。我还没有完整地评论这个游戏，所以如果你需要澄清一些变量，我可以给你。 (顺便说一句，这是一个要求制作井字游戏的c++项目) 我的主要问题是，我将如何重复我的棋盘(每次有人
Python实现的井字棋（Tic Tac Toe）游戏示例
本文实例讲述了Python实现的井字棋（Tic Tac Toe）游戏。分享给大家供大家参考，具体如下：说明用python实现了井字棋，整个框架是本人自己构思的，自认为比较满意。另外，90%+
使用Python编写一个简单的tic-tac-toe游戏的教程
这个教程，我们将展示如何用python创建一个井字游戏。其中我们将使用函数、数组、if条件语句、while循环语句和错误捕获等。首先我们需要创建两个函数，第一个函数用来显示游戏板:
terminal - 您可以在终端中使用 tac 命令吗？
我正在尝试从命令行(使用终端)以相反的顺序搜索大文件。我找到了 tac 命令:http://clifgriffin.com/2008/11/25/tac-and-reverse-grep/ tac 是
compilation - 三地址码(TAC/3AC)
在阅读时，我遇到了“中级语言”和“3AC”这两个术语。据我了解，IL 是源代码编译过程中的中间“步骤”。更具体地说，我正在阅读有关字节码(Java)和 C 的内容。我解释它的方式(如果错了请纠正我
tic-tac-toe - 使计算机永远不会在井字游戏中迷路
我正在为C的Tic Tac Toe代码编写一个简单的游戏。我已经完成了大部分代码，但是我希望AI永不丢失。我已经阅读了有关minimax算法的信息，但我不理解。如何使用此算法使计算机获胜或平局，但永
javascript - 使用reactjs在tic tac toe应用程序中渲染图像
我正在尝试使用reactjs创建一个简单的井字棋应用程序，其中有两种模式:经典和图像，在经典模式下我可以选择显示 X 和 O，在图像模式下，我可以选择两个显示下面提到的两个图像。我的文件结构是: sr
java - 如何将三地址码(TAC)转换为Java字节码？
我想将普通的三地址代码文件转换为 Java 字节码。已经有一些与此主题相关的问题，但没有得到解答 properly或question远远超出了我正在寻找的范围。以《龙书》中的编译器前端生成的这段代码
perl - 实现一个简单的 tac 程序
我试图解决 Schwartz 的“学习 Perl”中的一个练习，这时我在编写的代码中偶然发现了意外的输出。我想知道我做错了什么。 Qn:实现一个类似于 unix 实用程序的简单 tac。我的解决方案
talend - 从 TAC 传递参数以执行作业
我有一份非常通用的工作，不同的参数作为来自不同文件的上下文参数传递。但我仍然需要“硬编码”上下文文件名并在 TAC (Talend Administration Console) 中创建多个作业以供执
c++ - Tic Tac Toe中如何分出胜负以及如何不让双方都进入同一个位置？
我现在想用我的代码做两件事。1) 检查获胜者2) 不让双方玩家在同一个位置进入eg.如果player1已经在board[0][0]='X'处输入了value，player2再次进入board[0][0
python - 如何避免扭曲的 tac 文件中出现导入错误？
我有一个扭曲的 tac 文件 (twisted_service.py)，其中包含代码: from twisted.application import service # application.py
linux - 使用 tac 反向读取文件
我是 UNIX 编码的新手，我有一个文件需要逐行反向读取。该文件在 {} 中有代码段。然后我需要使用这个反向文件作为输入来运行一个 awk 脚本。我正在让我们的支持人员安装 tac，但在他们安装之前，
javascript - Tic Tac Toe 游戏结束后禁用按钮
感谢这里人们的帮助，我成功地禁用了点击 div 并在已经使用 $(".pos").addClass('already-played'); 选择它们时覆盖它们；以及 CSS 中的这个: .已经播放{
java - Tic Tac Toe 游戏重置太快
我有一个井字棋游戏，其中用户(x)玩CPU(o)。游戏开始时，CPU 将 (o) 放置在中心，并在用户之后移动到随机位置。游戏设置为循环，但一旦出现获胜者，它就会重置，并且不会显示“你赢/输的横幅”。
javascript Tic tac toe 游戏等待用户输入
我试图在没有人工智能的情况下实现井字棋游戏。不知怎的，我的点击功能会自动触发。您能帮我理解为什么点击功能会自动触发吗？这是 HTML 代码片段。 Tic Tac Toe Gam
c - Tic-Tac-Toe:如何填充决策树？
我正在制作一个井字游戏程序。我计划将 minimax 与它一起使用。我制作了一棵树，其中包含所有可能的游戏序列的空间，并且我正在寻找一种方法来填充它。我目前有这种类型: typedef struct
java - 如何实现java tic tac toe游戏功能
我在完成这项学校作业时遇到了问题。我想实现一种方法，其中代码显示 //call method to check for Winner，在每轮后检查获胜者。我不确定该怎么做。我尝试过各种不同的方法。然
Java Tic Tac Toe 构造函数
我正在尝试遵循本教程: https://www.youtube.com/watch?v=Db3cC5iPrOM 2:59 我听不懂他在说什么。我不明白为什么他在构造函数(public static
mobile - 如何从 IMEI 中检索 TAC？
问题很简单。我有一个 IMEI，我想从中检索 TAC。我该怎么做？如果我只有 IMEI，是否有办法识别 TAC 应该有多少位数字？是否需要明确知道设备的生产年份才能知道？最佳答案从头开始读取 8

首页

博学

6Ren·AI

商城

Javascript Tic Tac Toe 游戏不会验证对 Angular 获胜者