我正在做一个井字游戏。
我如何更改以下代码,以便在完成之前声明获胜者为真(每个方格填充)并且获胜者是第一个获得3个匹配值的人,而不是最后一个实现它?
function check_squares () {
var values = new Array();
var complete = true;
$('.square').each(function () {
values.push( $(this).html() );
//if ($(this).html() == '') complete = false;
});
if (complete == true) {
var winner = false;
if ( values[0] == values[1] && values[1] == values[2] ) winner = values[0];
if ( values[3] == values[4] && values[4] == values[5] ) winner = values[3];
if ( values[6] == values[7] && values[7] == values[8] ) winner = values[6];
if ( values[0] == values[3] && values[3] == values[6] ) winner = values[0];
if ( values[1] == values[4] && values[4] == values[7] ) winner = values[1];
if ( values[2] == values[5] && values[5] == values[8] ) winner = values[2];
if ( values[0] == values[4] && values[4] == values[8] ) winner = values[0];
if ( values[2] == values[4] && values[4] == values[6] ) winner = values[2];
if (winner) {
$('#output').html('Winner: ' + winner);
} else {
$('#output').html('No Winner');
}
} else {
if (player_x == true) {
$('#output').html('x turn to move');
} else {
$('#output').html('o turn to move');
}
}
}
答案 0 :(得分:0)
你的功能几乎是正确的。主要是,每次玩家更改单元格的值时,您只需要调用它。
我稍微调整了你的功能,允许多次调用它。我已经对我更改的部分添加了注释,以便于查找。
// Move these two variables into the global scope so that they are not reset
// by each call to check_squares and so that our click function can access them.
var complete = false;
var winner = null;
function check_squares () {
var values = new Array();
$('.square').each(function () {
values.push( $(this).html() );
//if ($(this).html() == '') complete = false;
});
// Debug statement to see the order of the values.
console.log(values);
if (!complete) {
if ( values[0] == values[1] && values[1] == values[2] ) winner = values[0];
if ( values[3] == values[4] && values[4] == values[5] ) winner = values[3];
if ( values[6] == values[7] && values[7] == values[8] ) winner = values[6];
if ( values[0] == values[3] && values[3] == values[6] ) winner = values[0];
if ( values[1] == values[4] && values[4] == values[7] ) winner = values[1];
if ( values[2] == values[5] && values[5] == values[8] ) winner = values[2];
if ( values[0] == values[4] && values[4] == values[8] ) winner = values[0];
if ( values[2] == values[4] && values[4] == values[6] ) winner = values[2];
if (winner) {
$('#output').html('Winner: ' + winner);
// Indicate that there was a winner so no more input is allowed.
complete = true;
} else {
$('#output').html('No Winner');
}
} else {
if (player_x == true) {
$('#output').html('x turn to move');
} else {
$('#output').html('o turn to move');
}
}
}
// Add a click handler to each square that checks for win conditions after each
// X or 0 is added.
$(".square").click(function() {
if (!complete)
{
// This obviously needs to be changed to determine which player is going.
$(this).html("X");
check_squares();
}
});
我创建了一个简单的JSFiddle来查看一个有效的例子。