如何在Javascript井字游戏中在玩家之间切换

如何在Javascript井字游戏中在玩家之间切换,javascript,html,if-statement,tic-tac-toe,Javascript,Html,If Statement,Tic Tac Toe,我还是JS的新手,非常感谢你的帮助和解释。所以我来了;我一点也不知道为什么我下面的代码不是每次两个玩家中的一个点击他们想要的任何情况时都在“X”和“O”之间切换。有一件事是肯定的,我的if语句的逻辑有问题 我的html如下所示: <!DOCTYPE html> <html> <head> <title>Tic Tac Toe</title> <script text="javascript" src="tic.js

我还是JS的新手,非常感谢你的帮助和解释。所以我来了;我一点也不知道为什么我下面的代码不是每次两个玩家中的一个点击他们想要的任何情况时都在“X”和“O”之间切换。有一件事是肯定的,我的if语句的逻辑有问题

我的html如下所示:

<!DOCTYPE html>
<html>
<head>
    <title>Tic Tac Toe</title>
    <script text="javascript" src="tic.js"></script>
    <link rel="stylesheet" type="text/css" href="style.css">
</head>
<center>
<body>
    <h1 style="font-family:arial;">Tic-Tac-Toe</h1>
    <table>
    <tr>
        <td id = "case1" onclick="display_input('case1')"></td>
        <td id = "case2" onclick="display_input('case2')"></td>
        <td id = "case3" onclick="display_input('case3')"></td>
    </tr>
    <tr>
        <td id = "case4" onclick="display_input('case4')"></td>
        <td id = "case5" onclick="display_input('case5')"></td>
        <td id = "case6" onclick="display_input('case6')"></td>
    </tr>
    <tr>
        <td id = "case7" onclick="display_input('case7')"></td>
        <td id = "case8" onclick="display_input('case8')"></td>
        <td id = "case9" onclick="display_input('case9')"></td>
    </tr>
</table>
<footer>
    <p>Copyright&copy; 2014</p>
</footer>
</body>
</center>   
</html>

每次调用
display\u input
,您都会使用相同的值初始化一个新的
player\u one
变量:
1
。将声明移到函数之外,以便后续调用实际切换(一个)范围更高的变量:

var player_one = 1;
function display_input(square){ 
    if ( player_one == 1 ){
        document.getElementById(square).innerHTML = "X";
        player_one = 0;
    } else {
        document.getElementById(square).innerHTML = "O";    
        player_one = 1;
    }   
}

因为
var player\u one=1位于函数
显示\u输入
内,这意味着它是本地的。也就是说,每次单击
td
player\u one
将等于
1
。要解决这个问题,只需将
var player\u one=1函数之外之前(在代码顶部)也阅读了关于JavaScript变量scopeOh的内容,这对我来说有点丢脸。谢谢你的帮助,好心的先生!你能不能再详细说明一下呢?简单地说,当你的javascript加载并且你的变量在函数外时,它只执行一次。这或多或少是一种初始化。之后,每次单击按钮时,只执行该函数(并且它将检查初始化时为1的当前值)。这篇文章应该阐明JS中的范围是什么:@贝尔吉WOW,我看到你是如何制作113K的,请考虑一下你的进取心。@ Bergi,我只是开玩笑,这是真的,但是很多人不接受和回答,有时有点恼人。对不起,我是AFK。您的答案现在已被成功接受:)
var player_one = 1;
function display_input(square){ 
    if ( player_one == 1 ){
        document.getElementById(square).innerHTML = "X";
        player_one = 0;
    } else {
        document.getElementById(square).innerHTML = "O";    
        player_one = 1;
    }   
}