Проблемы и функции табличного формата не работают

Я запрограммировал простую игру tic-tac-toe. Когда появляется таблица, все сжигает. Есть ли способ держать таблицу пустой, но не хлюпать? Кроме того, я использую NotePad ++, и когда я пытаюсь запустить свою программу в FireFox, функции не работают. Я не знаю, почему, кто-нибудь знает? Я могу заставить его работать в Chrome, но он должен работать в FireFox. Вот моя программа:Проблемы и функции табличного формата не работают

<html> 
<head> 
    <style> 
     .Square{ 
     width:60px; 
     height 60px; 
     text-align:center; 
     font-size: 18pt; 
     font-weight: bold; 
     font-family: Verdana; 
     } 
    </style> 

     <script> 
      function startGame() 
       { 
        for (var i = 1; i<= 9; i = i + 1) 
        { 
         clearBox(i); 
        } 

       document.turn = "X"; 
       if (Math.random()< 0.5) 
       { 
        document.turn = "O"; 
       } 
       document.winner = null; 
       setMessage(document.turn + " gets to start."); 
      } 

      function setMessage(msg) 
      { 
      document.getElementById("message").innerText = msg; 
      } 

      function nextMove(square) 
      { 
       if (document.winner != null) 
       { 
        setMessage(document.winner + " Already Wone the Game!"); 
       } 
       else if (square.innerText == "") 
       { 
        square.innerText = document.turn; 
        switchTurn(); 
       } 
       else 
       { 
        setMessage("That Square is Already Used.") 
       } 
      } 

      function switchTurn() 
      { 
       if(checkForWinner(document.turn)) 
       { 
        setMessage("Contratulations " + document.turn + "! You Win!"); 
        document.winner = document.turn; 
       } 
        else if (document.turn == "X") 
         { 
          document.turn ="O"; 
          setMessage("It's " + document.turn + "'s turn!"); 
         } 
        else 
        { 
         document.turn ="X"; 
         setMessage("It's " + document.turn + "'s turn!"); 
        } 
      } 

      function checkForWinner(move) 
      { 
       var result = false; 
       if(checkRow(1,2,3, move) || 
        checkRow(4,5,6, move) || 
        checkRow(7,8,9, move) || 
        checkRow(1,4,7, move) || 
        checkRow(2,5,8, move) || 
        checkRow(3,6,9, move) || 
        checkRow(1,5,9, move) || 
        checkRow(3,5,7, move)) 
        { 
        result = true; 
        } 
        return result; 
      } 

      function checkRow(a,b,c, move) 
      { 
       var result = false; 
       if (getBox(a)== move && getBox(b)== move && getBox(c)== move) 
       { 
       result = true; 
       } 
       return result; 
      } 

      function getBox(number) 
      { 
       return document.getElementById("s" + number).innerText; 
      } 

      function clearBox(number) 
      { 
       document.getElementById("s" + number).innerText = ""; 
      } 

     </script> 

</head> 

<body onload= "startGame();"> 
    <h1> Tic-Tac-Toe!</h1> 
    <div id="message">message will be here </div> 
    <table border= "1"> 
     <tr> 
      <td id="s1" class= "Square" onclick="nextMove(this);"></td> 
      <td id="s2" class= "Square" onclick="nextMove(this);"></td> 
      <td id="s3" class= "Square" onclick="nextMove(this);"></td> 
     </tr> 
     <tr> 
      <td id="s4" class= "Square" onclick="nextMove(this);"></td> 
      <td id="s5" class= "Square" onclick="nextMove(this);"></td> 
      <td id="s6" class= "Square" onclick="nextMove(this);"></td> 
     </tr> 
     <tr> 
      <td id="s7" class= "Square" onclick="nextMove(this);"></td> 
      <td id="s8" class= "Square" onclick="nextMove(this);"></td> 
      <td id="s9" class= "Square" onclick="nextMove(this);"></td> 
     </tr> 
    </table> 
    <a href= "javascript:startGame();"> Start New Game</a> 
</body> 
</html>

источник

2015-02-08 retrogirl19

'document.getElementById ("s" + номер) .innerText = " ";' – dandavis

Вы забыли : после height в height: 60px;

первоначально, я предложил добавить td {height: 40px;}, но ... просто добавить : и вы будете в порядке.

<style> 

    td {height: 40px;} //nevermind, you don't need this 

    .Square{ 
     width:60px; 
     height: 60px; //I JUST REALIZED YOU FORGOT A : 
     text-align:center; 
     font-size: 18pt; 
     font-weight: bold; 
     font-family: Verdana; } 

</style>

источник

2015-02-08 03:30:20 cake

Спасибо так много! – retrogirl19

@ retrogirl19 Я только что понял - вы на самом деле просто забыли ':' после высоты. Вам не нужна вся команда 'td'>. <. возгласы. – cake

Все хорошо! Спасибо, еще! – retrogirl19

Replace 

    <style> 
     .Square{ 
     width:60px; 
     height 60px; 
     text-align:center; 
     font-size: 18pt; 
     font-weight: bold; 
     font-family: Verdana; 
     } 
    </style> 

With 

<style> 
     .Square{ 
     width:60px; 
     height:60px; 
     text-align:center; 
     font-size: 18pt; 
     font-weight: bold; 
     font-family: Verdana; 
     } 
    </style> 

you missed : after height.

источник

2015-02-08 06:53:27 Rajashekhar

Проблемы и функции табличного формата не работают

ответ

Смежные вопросы