Крестики-нолики — Возвращение отмеченного квадратного числа

Я пытаюсь создать игру «Крестики-нолики» с помощью JavaScript; У меня есть таблица (HTML):

  <table>
    <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>

и JavaScript:

var tie = 0;
var move = 1;
function startGame(){
    for(var i =1; i < 10 ; i++){ //clears all squares
        clearBox(i)
    }
    tie=0;
    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 setMoves(num){
        if(num == 1)    
            document.getElementById("one").innerText = "player " + document.turn + " selected square " ;
        else if (num == 2)
            document.getElementById("two").innerText = "player " + document.turn + " selected square " ;
        else if (num == 3)
            document.getElementById("tree").innerText = "player " + document.turn + " selected square " ;
        else if (num == 4)
            document.getElementById("four").innerText = "player " + document.turn + " selected square " ;
        else if (num == 5)
            document.getElementById("five").innerText = "player " + document.turn + " selected square " ;
        else if (num == 6)
            document.getElementById("six").innerText = "player " + document.turn + " selected square " ;
        else if (num == 7)
            document.getElementById("seven").innerText = "player " + document.turn + " selected square " ;
        else if (num == 8)
            document.getElementById("eight").innerText = "player " + document.turn + " selected square " ;
        else if (num == 9)
            document.getElementById("nine").innerText = "player " + document.turn + " selected square " ;


}

function nextMove(square){

    if(document.winner != null){
        setMessage(document.winner + " already won the game, please start over");
    }else if(square.innerText == ""){
        square.innerText = document.turn;
        switchTurn();
    }else{
        setMessage("That square is already used!");
    }

    setMoves(tie);

}


function switchTurn(){

    tie++;
    if(checkForWinner(document.turn)){
        setMessage(document.turn + " Won!!!");
        document.winner = document.turn;
    }else if(document.turn == "X"){
        document.turn = "O";
        setMessage("its " + document.turn + " turn");
    }else{
        document.turn = "X";
        setMessage("its " + document.turn + " turn");
    }

    setMoves(tie);

    if(checkTie())
        setMessage("its a tieeeeeeeeeeeeeeeeeeeeeeeeeee"); ///////////////////////////////////////////////////////////////////////////////////


}

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

function tieeeOne(number){
    return document.getElementById("s" + number).innerText != "";
}

function checkTie(){
    var flg = false;
    for(i=0; i<10; i++)
        if (tieeeOne())
        {
            flg=true;
        }
    return flg;
}

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

function checkForTie(a, b, c, d, e, f, g, h, i)
{
    var tie = false;
    if(getBox(a) == move && getBox(b) == move && getBox(c) == move
    && getBox(d) == move && getBox(e) == move && getBox(f) == move
    && getBox(g) == move && getBox(h) == move && getBox(i) == move){
        tie = true;
    }
    return tie;
}

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;
}

Я хочу создать функцию, которая будет возвращать номер последнего отмеченного квадрата (1-9), возможно ли это? Я хочу создать журнал и мне нужно знать, какой квадрат был отмечен?

См. также:  MySQL объединяет 3 таблицы в один общий столбец и изменяет столбцы

Кажется, нет элемента с id = one?   —  person Coder123    schedule 09.09.2015

Понравилась статья? Поделиться с друзьями:
IT Шеф
Комментарии: 2
  1. Coder123

    Вы можете создать глобальную переменную lastMove и установить ее в nextMove (). Просто назначьте lastMove = square.id; Тогда просто убедитесь, что вы прояснили это в своей новой игровой логике.

  2. Coder123

    Легкий способ сделать это — создать глобальную переменную, которая будет установлена ​​в вашей функции nextMove (). Вы бы создали переменную

    var lastMove;
    

    Затем вы можете установить его в качестве переменной, используя идентификатор элемента <td>.

    function nextMove(square) {
    
    if (document.winner != null) {
        setMessage(document.winner + " already won the game, please start over");
    } else if (square.innerText == "") {
        square.innerText = document.turn;
    
        // Code to set variable goes here  
    
        switchTurn();
    } else {
        setMessage("That square is already used!");
    }
    
    setMoves(tie);
    
    }
    
Добавить комментарий

;-) :| :x :twisted: :smile: :shock: :sad: :roll: :razz: :oops: :o :mrgreen: :lol: :idea: :grin: :evil: :cry: :cool: :arrow: :???: :?: :!: