井字游戏不改变单元格答案

【问题标题】：tic tac toe not making changes in cell井字游戏不改变单元格
【发布时间】：2021-03-24 09:36:53
【问题描述】：

我将我的 html 与 js 和 css 相关联，但我的代码无法正常工作。我尝试为所有表格单元格使用类名，但它仍然不起作用我的 html 文件：

!DOCTYPE html>
<html lang="en" dir="ltr">

<link rel="stylesheet" href="something.css">
<!--bootstrap library-->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">

<!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/4.5.1/jquery.min.js"></script>

<!-- Latest compiled JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>


    <meta charset="utf-8">
    <title>tic tac toe</title>
  </head>
  <body>
    <div class="jumbotron jumbotron-bg">
    <h1 class="display-4 text-color" style="font-weight: 500  ">WELCOME</h1>
    <p class="lead">play tic tac toe</p>
    <hr class="my-4">
    <p></p>
    <p class="lead">
      <a class="btn btn-primary btn-lg" href="#" role="button">start</a>
    </p>
  </div>
  </div>
    <table>
      <tr>
        <td></td>
        <td ></td>
        <td ></td>
      </tr>
      <tr>
        <td ></td>
        <td ></td>
        <td ></td>
      </tr>
      <tr>
        <td ></td>
        <td ></td>
        <td ></td>
      </tr>
    </table>

<script src="tictac.js">

</script>

  </body>
</html>

忽略开始按钮我将此与 js 代码相关联，以使上述代码的更改正常工作，并在 css 的帮助下打印了一个带有空单元格的 3x3 表格

我的js代码：

var table = document.querySelectorAll('td')
function click(){
  if(this.textComment==""){
    this.textComment="o"
  }
  if (this.textComment=="o") {
    this.textComment=""
  }
  if (this.textComment=="") {
    this.textComment="x"

  }
}
for (var i = 0; i < table.length; i++) {
  table[i].addEventListener("click", click())
}

【问题讨论】：

标签： javascript html css tic-tac-toe

【解决方案1】：

乍一看我可以看到你需要绑定函数click而不是它的执行结果。将您的 事件监听器 行更改为 table[i].addEventListener("click", click)。

另外我认为你的意思是在click 中使用textContent 而不是textComment。

【讨论】：