4

我用 JavaScript 写了一个扫雷器，它工作了一段时间，然后随机运行 1 次（我试图改进样式）它给了我这个：

右上角的傻1

请注意右上角的“1”以及 2 在其下方缺少 1 的两个和三个空格

这是我将数字添加到正方形的函数：

function nextToBombCheck(event) {   
    //reset bomb count
bombCount = 0 ;
    //initialize variable for checking nerby boxes
var nextToBox = 0;
    //asign the box's id as a number
var boxNum = parseInt(event.id);

var checkSide = 0;

for ( var i = 9 ; i <= 11 ; i++ ) {
    nextToBox = boxNum + i;
        //check if its a wrap
    if ( ( nextToBox%10 === 0 && boxNum%10 === 9 ) || ( nextToBox%10 === 9 && boxNum%10 === 0 ) ) {
        continue;
        //check boxes below
    } else if ( bomb.indexOf( nextToBox ) >= 0 ) {
        bombCount++;
    }
}

for ( i = -1 ; i <= 1 ; i++ ) {
    nextToBox = boxNum + i;
        //check if its a wrap (above and below wont work anyway)
    if ( ( nextToBox%10 === 0 && boxNum%10 === 9 ) || ( nextToBox%10 === 9 && boxNum%10 === 0 ) ) {
        continue;
        //check boxes alongside
    } else if ( bomb.indexOf( nextToBox ) >= 0 ) {
        bombCount++;
    }
}

for ( i = -11 ; i <= -9 ; i++ ) {
    nextToBox = boxNum + i;
    if ( ( nextToBox%10 === 0 && boxNum%10 === 9 ) || ( nextToBox%10 === 9 && boxNum%10 === 0 ) ) {
        continue;
        //check boxes above
    } else if ( bomb.indexOf( nextToBox ) >= 0 ) {
        bombCount++;
    }
}
        //set class(colors) based on bombCount
    event.className = classList[ bombCount ];
if ( bombCount !== 0 ) {
        //write number of neighboring bombs
    event.innerHTML = bombCount;
}
}

我的程序使用表格工作，每个 td 都有一个 id 0-99

如果有帮助，这里有一个链接

4

3 回答 3

2

不错的游戏。但是您犯了计算最后一个索引的常见错误。你看到你的桌子有大小11x11 = 121吗？但是在你的程序中你使用

var rowAmount = 10;
var columnAmount = 10;

cellAmount = columnAmount * rowAmount;

这是错误的。for 循环还明确假设有 11 列：

for ( i = 0 ; i <= rowAmount ; i++ ) {
    gameBox += "<tr>";
    for ( var j = 0 ; j <= columnAmount ; j++ ) {
        var idValue = i * 10 + j;
        gameBox += "<td class = 'box' id = '" + idValue + "' onclick = 'process(this);' ></td>";    }
    gameBox += "</tr>";
}

但idValue正在使用 10 列。这意味着您的程序将忽略最后一列。在你所有的代码中改变它，你会没事的。

于 2013-08-18T06:47:58.007 回答
1

我相信这个问题与您在 Chrome 检查器的屏幕截图中看到的具有相同 id 的多个元素有关。您可以注意到该行的最后一个单元格和下一行的第一个单元格具有相同的 id。这适用于所有行。

在此处输入图像描述

于 2013-08-18T06:47:05.437 回答
0

而不是使用取模技巧等，而是使用 X 和 Y 坐标并具有从给定Xand获取单元格 ID 的函数Y，即

function getCellId(x, y) {
    return 'cell-' + x + '-' + y);
}

并命名您的单元格 ID cell-0-0->cell-9-9

那么相邻单元格是

(x - 1, y - 1)
(x,     y - 1)
(x + 1, y - 1)
(x - 1, y    )
(x + 1, y    )
(x - 1, y + 1)
(x,     y + 1)
(x + 1, y + 1)

如果使用了这种方法，这个问题也可以避免。

于 2013-08-18T06:55:17.493 回答