Question

我正在与香草JS一起制作Tic Tac Toe游戏，我在确定＆＃39; onclick = click（this.id）＆＃39;时遇到了问题。它无法识别它。

谢谢这是我的HTML：

<!DOCTYPE html>
<html>
    <head>
        <title>Tic Tac Toe</title>
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta name="author" content="Sameed Baqai">
        <meta name="description" content="Tic Tac Toe">
        <link rel="stylesheet" href="static/css/css1.css">
    </head>

    <body>
        <div id="header">
            <h1>Tic Tac Toe</h1>
            <p id="vs">VS</p>
            <div id="person">
                <div id="hair"></div>
                <div class="eyes left">
                        <div class="blink"></div>
                </div>
                <div class="eyes right">
                        <div class="blink"></div>
                </div>
            </div>
            <p id="you">YOU</p>
            <div id="comp">
                <div id="screen">
                     <div class="eyes left">
                        <div class="blink"></div>
                    </div>
                    <div class="eyes right">
                        <div class="blink"></div>
                    </div>
                </div>
            </div>
            <p id="AI">AI</p>
            <p id="best">You think you can best my AI?</p>
            <a href="#cross_table" id="click">Click here to start</a>
        </div>

        <div id="cross_table">
           <ul id="game">
               <li class="game_li"><button class="buts" id="btn0" onclick="click(this.id)"></button></li>
               <li class="game_li"><button class="buts" id="btn1"></button></li>
               <li class="game_li"><button class="buts" id="btn2"></button></li>
               <li class="game_li"><button class="buts" id="btn3"></button></li>
               <li class="game_li"><button class="buts" id="btn4"></button></li>
               <li class="game_li"><button class="buts" id="btn5"></button></li>
               <li class="game_li"><button class="buts" id="btn6"></button></li>
               <li class="game_li"><button class="buts" id="btn7"></button></li>
               <li class="game_li"><button class="buts" id="btn8"></button></li>
           </ul> 
        </div>
        <div id="btn">
            <button type="button" onclick="table()">Start New Game</button>
        </div>
        <script src="static/js/js1.js"></script>
    </body>
</html>

这里是我的JS：

var game={
    user:'X',
    computer:'O',
    currentPlayer:''
};
var setCurrentPlayer=function(user){
    game.currentPlayer=user;
};
(function(){
    /*var buttons=document.getElementsByClassName('buts');
    console.log(buttons);
    for(var i=0;i<buttons.length;i++){
       buttons[i].setAttribute("id","btn"+i);
        buttons[i].setAttribute("onclick","click(this.id)");
    }*/

    var but5=document.getElementById("btn5");
    var firstStep=function(){
        but5.innerHTML=game.computer;
        but5.setAttribute("disabled","disabled");
        but5.style.backgroundColor="red";
        setCurrentPlayer('user');
    };
    firstStep();

}
)(window.onload);

虽然我在这里没有点击功能，但我确实尝试在我的示波器功能中添加这样的功能，但它仍然没有工作我想要的只是当用户点击带有id的按钮时。它应该在警告框中显示我的ID，如果我能弄明白，我可以继续下一步。

这是我正在尝试实现的代码，我知道它的基本内容：

var click=function(id){
        alert(id);
};

Answer 1

显然，您无法定义名为＆＃34的功能;请单击＆＃34;。尝试将其更改为其他名称（例如＆＃34;点击＆＃34;）。

＆＃13;

<script>
  var clicked=function(id){
          alert(id);
  };
</script>
<div id="cross_table">
  <ul id="game">
    <li class="game_li"><button class="buts" id="btn0" onclick="clicked(this.id)">B1</button></li>
    <li class="game_li"><button class="buts" id="btn1" onclick="clicked(this.id)">B2</button></li>
    <li class="game_li"><button class="buts" id="btn2" onclick="clicked(this.id)">B3</button></li>
    <li class="game_li"><button class="buts" id="btn3" onclick="clicked(this.id)">B4</button></li>
    <li class="game_li"><button class="buts" id="btn4" onclick="clicked(this.id)">B5</button></li>
    <li class="game_li"><button class="buts" id="btn5" onclick="clicked(this.id)">B6</button></li>
    <li class="game_li"><button class="buts" id="btn6" onclick="clicked(this.id)">B7</button></li>
    <li class="game_li"><button class="buts" id="btn7" onclick="clicked(this.id)">B8</button></li>
    <li class="game_li"><button class="buts" id="btn8" onclick="clicked(this.id)">B9</button></li>
  </ul> 
</div>

＆＃13;

我的javascript文件中的范围问题

1 个答案: