Tictactoe游戏代码

Question

我创造了这个游戏很多小时。我完成它没有任何语法错误。

我尝试播放它，但它不起作用。我不知道为什么？我的代码有问题吗？

<script> 
 
    function startTac() { 
 
    var t1 = document.getElementById("1"); 
 
    var t2 = document.getElementById("2"); 
 
    var t3 = document.getElementById("3"); 
 
    var t4 = document.getElementById("4"); 
 
    var t5 = document.getElementById("5"); 
 
    var t6 = document.getElementById("6"); 
 
    var t7 = document.getElementById("7"); 
 
    var t8 = document.getElementById("8"); 
 
    var t9 = document.getElementById("9"); 
 
    var plyr = "X"; 
 
    if ((t1.innerHTML) == (t2.innerHTML) && (t2.innerHTML) == (t3.innerHTML) || (t4.innerHTML) == (t5.innerHTML) && (t5.innerHTML) == (t6.innerHTML) || (t7.innerHTML) == (t8.innerHTML) && (t8.innerHTML) == (t9.innerHTML)) { 
 
     alert("Game Over"); 
 
    } 
 
    } 
 
    if ((t1.innerHTML) == (t4.innerHTML) && (t4.innerHTML) == (t7.innerHTML) || (t2.innerHTML) == (t5.innerHTML) && (t5.innerHTML) == (t8.innerHTML) || (t3.innerHTML) == (t6.innerHTML) && (t6.innerHTML) == (t9.innerHTML)) { 
 
    alert("Game Over"); 
 
    } 
 
    } 
 
    if ((t1.innerHTML) == (t5.innerHTML) && (t5.innerHTML) == (t9.innerHTML) || (t3.innerHTML) == (t5.innerHTML) && (t5.innerHTML) == (t7.innerHTML)) { 
 
    alert("Game Over"); 
 
    } 
 
    } 
 

 
    function gameTac(tar) { 
 
    switch (plyr) { 
 
     case "X": 
 
     { 
 
      document.getElementById(tar).innerHTML = "O"; 
 
      document.getElementById(tar).setAtrribute(" onclick", ""); 
 
      plyr = "O";startTac(); 
 
      break; 
 
     } 
 
     case "O": 
 
     { 
 
      document.getElementById(tar).innerHTML = "X"; 
 
      document.getElementById(tar).setAtrribute(" onclick", ""); 
 
      plyr = "X";startTac(); 
 
      break; 
 
     } 
 
    } 
 
    } 
 
</script> 
 
<table border="1" width="400px" height="400px" style="margin: 0px; padding: 0px;"> 
 
    <tbody> 
 
    <tr> 
 
     <td id="1" onclick="gameTac(this.id)"></td> 
 
     <td id="2" onclick="gameTac(this.id)"></td> 
 
     <td id="3" onclick="gameTac(this.id)">H</td> 
 
    </tr> 
 
    <tr> 
 
     <td id="4" onclick="gameTac(this.id)"></td> 
 
     <td id="5" onclick="gameTac(this.id)"></td> 
 
     <td id="6" onclick="gameTac(this.id)"></td> 
 
    </tr> 
 
    <tr> 
 
     <td id="7" onclick="gameTac(this.id)"></td> 
 
     <td id="8" onclick="gameTac(this.id)"></td> 
 
     <td id="9" onclick="gameTac(this.id)"></td> 
 
    </tr> 
 
    </tbody> 
 
</table>

任何人都可以解决我的代码？

我无法修复我的代码，因为我在android上创建了这个代码。谢谢！

Answer 1

我首先想到的是，你需要仔细检查，然后确保你的条件是正确的：

if ((t1.innerHTML == t2.innerHTML && t2.innerHTML == t3.innerHTML) || (t4.innerHTML == t5.innerHTML && t5.innerHTML == t6.innerHTML) || (t7.innerHTML == t8.innerHTML && t8.innerHTML == t9.innerHTML)) { 
     alert("Game Over"); 
} 

和：

if ((t1.innerHTML == t4.innerHTML && t4.innerHTML == t7.innerHTML) || (t2.innerHTML == t5.innerHTML && t5.innerHTML == t8.innerHTML) || (t3.innerHTML == t6.innerHTML && t6.innerHTML == t9.innerHTML)) { 
    alert("Game Over"); 
} 

和：

if ((t1.innerHTML == t5.innerHTML && t5.innerHTML == t9.innerHTML) || (t3.innerHTML == t5.innerHTML && t5.innerHTML == t7.innerHTML)) { 
    alert("Game Over"); 
    } 

Answer 2

1. 你在中有几个额外的
2. 有人决定一次，你不能使用数字作为ID，认真。
3. 从startTac（）中取出var plyr = "X"，将该行放在它的上方，否则每次点击都将复位为X。
4. setAttribute("onclick","")在代码
5. 要去拼错已在您的条件块工作，他们将在启动触发，因为空单元格相等
6. 或许应该说谁赢了，当你在有一个游戏。

Answer 3

简而言之：您的代码有很多错误...（请参阅其他答案以了解具体情况）。这里有一些代码可以让你的游戏运行起来，我会留给你完成。

var plyr = "X"; 

function startTac() { 
    var t1 = document.getElementById("1"); 
    var t2 = document.getElementById("2"); 
    var t3 = document.getElementById("3"); 
    var t4 = document.getElementById("4"); 
    var t5 = document.getElementById("5"); 
    var t6 = document.getElementById("6"); 
    var t7 = document.getElementById("7"); 
    var t8 = document.getElementById("8"); 
    var t9 = document.getElementById("9"); 

    let tiles = [0, t1, t2, t3, t4, t5, t6, t7, t8, t9] 
    let winningPaths = [ 
     [1,2,3],[4,5,6],[7,8,9], 
     [1,4,7],[2,5,8],[3,6,9], 
     [1,5,9],[3,5,7] 
    ] 

    winningPaths.forEach(path => { 
     let matchingTiles = path.filter(id => { 
      let tile = tiles[id] 

      if(tile.textContent === plyr) { 
       return true 
      } else { 
       return false 
      } 

     }).length 

     if(matchingTiles === 3) { 
     alert("Game Over") 
     } 
    }) 

    }  

    function gameTac(tar) { 
    switch (plyr) { 
     case "X": 
     { 
      document.getElementById(tar).textContent = "O"; 
      document.getElementById(tar).onclick = undefined; 
      plyr = "O"; 
      startTac(); 
      break; 
     } 
     case "O": 
     { 
      document.getElementById(tar).textContent = "X"; 
      document.getElementById(tar).onclick = undefined; 
      plyr = "X"; 
      startTac(); 
      break; 
     } 
    } 
    }