JavaScript布尔如果语句问题

问题描述:

我有一个按钮,单击时会弹出一个警报窗口。点击按钮后,名为“master”的变量将从false更改为true。然后,我有一个if语句来检查变量是否为真。如果是,则它会提醒变量的值。这是问题:最后一部分没有发生。这就像if语句没有执行,然后停止了程序的其余部分。我确实检查了“主”变量是否注册为真,并且是,所以我真的不知道什么是错的。JavaScript布尔如果语句问题

  <!DOCTYPE html> 
      <html> 
      <head> 
       <title>Tic-Tac-Toe Game</title> 
       <!-- Latest compiled and minified CSS --> 
       <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css"> 

       <!-- Optional theme --> 
       <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css"> 
       <style type="text/css"> 
        #buttons{ 
         margin-top: 50px; 
        } 
        #x{ 
         margin-left: 10px; 
        } 
        #table{ 
         margin-top: 15px; 
         background: gray; 
         table-layout: fixed; 
         width: auto; 
         width: 250px; 
         height: 250px; 


        } 


       </style> 
      </head> 
      <body> 
       <div class="container" id="buttons">  
        <h2 id = "h2" >Choose your team!</h2> 
        <button onclick = "myFunctions()" type = "button" class="btn btn-default"><span style = "font-weight: bold; font-size: 110%;">O</span></button> 
        <button type = "button" id = "x" class="btn btn-default"><span class = "glyphicon glyphicon-remove"></span></button> 

        <table id = "table" class="table table-bordered"> 
         <tbody> 
          <tr> 
           <td id = "td" onclick="myFunction()"></td> 
           <td onclick="myFunction()"></td> 
           <td onclick="myFunction()"></td> 
          </tr> 
          <tr> 
           <td onclick="myFunction()"></td> 
           <td onclick="myFunction()"></td> 
           <td onclick="myFunction()"></td> 
          </tr> 
          <tr> 
           <td onclick="myFunction()"></td> 
           <td onclick="myFunction()"></td> 
           <td onclick="myFunction()"></td> 
          </tr> 
         </tbody> 
        </table> 


       </div> 


       <script type="text/javascript"> 
        var master = false; 
        var servant = false; 
        function myFunction(){ 
         alert('hi'); 
        } 

        function myFunctions(){ 
         master = true; 
        } 

        if (master == true) { 
         alert(master); 
        } 

       </script> 

       <!-- Latest compiled and minified JavaScript --> 
       <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script> 
      </body> 
      </html> 
+0

请为您的函数选择更好的名称。这是你问题的重要部分。 –

请参阅下面更正的代码。

<!DOCTYPE html> 
    <html> 
    <head> 
     <title>Tic-Tac-Toe Game</title> 
     <!-- Latest compiled and minified CSS --> 
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css"> 

     <!-- Optional theme --> 
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css"> 
     <style type="text/css"> 
      #buttons{ 
       margin-top: 50px; 
      } 
      #x{ 
       margin-left: 10px; 
      } 
      #table{ 
       margin-top: 15px; 
       background: gray; 
       table-layout: fixed; 
       width: auto; 
       width: 250px; 
       height: 250px; 


      } 


     </style> 
    </head> 
    <body> 
     <div class="container" id="buttons">  
      <h2 id = "h2" >Choose your team!</h2> 
      <button onclick = "myFunctions()" type = "button" class="btn btn-default"><span style = "font-weight: bold; font-size: 110%;">O</span></button> 
      <button type = "button" id = "x" class="btn btn-default"><span class = "glyphicon glyphicon-remove"></span></button> 

      <table id = "table" class="table table-bordered"> 
       <tbody> 
        <tr> 
         <td id = "td" onclick="myFunction()"></td> 
         <td onclick="myFunction()"></td> 
         <td onclick="myFunction()"></td> 
        </tr> 
        <tr> 
         <td onclick="myFunction()"></td> 
         <td onclick="myFunction()"></td> 
         <td onclick="myFunction()"></td> 
        </tr> 
        <tr> 
         <td onclick="myFunction()"></td> 
         <td onclick="myFunction()"></td> 
         <td onclick="myFunction()"></td> 
        </tr> 
       </tbody> 
      </table> 


     </div> 


     <script type="text/javascript"> 
      var master = false; 
      var servant = false; 
      function myFunction(){ 
       alert('hi'); 
       master = true; 
      if (master == true) { 
       alert(master); 
      } 
      } 
     </script> 

     <!-- Latest compiled and minified JavaScript --> 
     <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script> 
    </body> 
    </html> 

原因是不执行的是你曾经函数称为myFunctions,但实际上你是为onclick事件调用myFunction()

首先你要定义主为false,那么你就声明了两个功能:'myFunction'和'myFunctions',然后检查master ==是否为true。由于主人是虚假的,所以你不会看到警报。

当您单击按钮时,只有函数myFunction或myFunctions被执行。测试'master == true'不会再次执行,它不是函数的一部分