0

我正在做一个井字游戏。有人已经教过我如何宣布获胜者并停止进一步的比赛。

有两个持续存在的问题。第一个是当胜利直接交叉时，计数器将 x 获胜加 1，将 o 获胜加 2。第二个问题是我无法让比赛打成平局。如果没有结果，我已经尝试过。

这是整个js，游戏可以在：http: //jvonhausen.com/final/p19/

jQuery(function() {

    $('#start').click(clear_squares);

    $('.square').click(function () {    
        square_stuff(this);
    });

});

var player_x = true; 
var complete = false; 
var winner = '';
var x_wins = 0;
var o_wins = 0;
var draw = 0;

function clear_squares () {
    localStorage.setItem('x_count', x_wins); 
    localStorage.setItem('o_count', o_wins); 
    localStorage.setItem('draw_count', draw); 

    $('.square').html(''); 

    player_x = true;
    $('#output').html('turn: x');

    complete = false; //allows for new game
}


function square_stuff (square) {
    if (!complete) {
        if ($(square).html() == '') {       
            if (player_x == true) {
                $(square).html('x');
                player_x = false;               
            } else {            
                $(square).html('o');
                player_x = true;                
            }
        }
    }   
    check_squares();
}

function check_squares () {
    complete = true;
    var values = new Array(); 
    var winner = '';

    $('.square').each(function () {     
        values.push( $(this).html());
        if ($(this).html() == '') complete = false;
        if ( !winner && values[0] == values[1] && values[1] == values[2] ) winner = values[0];
        if ( !winner && values[3] == values[4] && values[4] == values[5] ) winner = values[4];
        if ( !winner && values[6] == values[7] && values[7] == values[8] ) winner = values[7];
        if ( !winner && values[0] == values[3] && values[3] == values[6] ) winner = values[3];
        if ( !winner && values[1] == values[4] && values[4] == values[7] ) winner = values[1];
        if ( !winner && values[2] == values[5] && values[5] == values[8] ) winner = values[5];
        if ( !winner && values[0] == values[4] && values[4] == values[8] ) winner = values[8];
        if ( !winner && values[2] == values[4] && values[4] == values[6] ) winner = values[2];      
        if (winner) {           
            complete = true;
            $('#output').html('winner: ' + winner);
            if ($(this).html() == 'x') {
                localStorage.setItem('x_count', x_wins); 
                x_wins++;
                $('#wins_x').val(x_wins);
            } 
            if ($(this).html() == 'o') {
                localStorage.setItem('o_count', o_wins); 
                o_wins++;
                $('#wins_o').val(o_wins);
            }
            if (winner == '' && complete == true) { 
                $('#output').html('no winner');
                localStorage.setItem('draw_count', draw); 
                draw++;
                $('#draws').val(draw);
            }   
        }                   
        if (winner == '' && complete == false) {    
            if (player_x == true) {     
                $('#output').html('turn: x');
            } else {        
                $('#output').html('turn: o');
            }       
        }
    });

}
4

1 回答 1

2

一旦你发现一个赢家，你就不会打破你的“每个”循环。我认为这会起作用：

$('.square').each(function () {  
    if (winner) {
       return;
    }   
    values.push( $(this).html());
    ....

或者，这更干净：

function check_squares () {
complete = true;
var values = []; // better way to declare an empty array
var winner = '';

// build the values array first
$('.square').each(function () {     
    values.push( $(this).html());
}

// then just check for a winner once... 
if ( !winner && values[0] == values[1] && values[1] == values[2] ) winner = values[0];
....

您的代码未检测到平局的原因是您的平局检查发生在“if (winner)”块内。

   if (winner) {           
        complete = true;
        ....

        // the clause will never get executed, because winner must have already been set to have made it this far
        // so winner == '' will aways be false
        if (winner == '') { 
            $('#output').html('no winner');
于 2012-05-18T03:54:49.223 回答