Question

我想知道我的代码有什么问题。我使用网站和javascript中的表格制作了一个井字游戏。以下是我的代码的相关部分：

INSIDE BODY：

<body>
    </table>

    <table id="matrix" border="1">
        <tr>
            <td class="cellCSS">
                <img alt="Click Here" class="imageCSS" onclick="imageClicked(this,0,0)"/>
            </td>
            <td class="cellCSS">
                <img alt="Click Here" class="imageCSS" onclick="imageClicked(this,0,1)"/>
            </td>
            <td class="cellCSS">
                <img alt="Click Here" class="imageCSS" onclick="imageClicked(this,0,2)"/>
            </td>
        </tr>
        ...
    </table>
</body>

这是函数imageClicked的相关部分：

...
same = false;
var r = 0;
tbl = document.getElementById("matrix");
//alert(tbl.rows.length);

for(r = 0; r < tbl.rows.length; r++) {
    // alert('Bob');
    var _tempmg = tbl.rows[r].cells[col].childNodes[0].src;
    alert(_tempmg);
    if (!_tempmg) break;
    if (_img.src != _tempmg) break;
    same = true;
}

if (r == tbl.rows.length && same) {
    alert(_img.src + "won");
    return;
}

same = false;
...

Answer 1

你的问题是r == tbl.rows.length总是假的，因为for循环迭代而r < tbl.rows.length。

Answer 2

您应该包含更多 imageClicked 功能。我猜它会开始：

function imageClicked(element, row, col) {

并在您发布的代码中：

same = false;

据推测，您之前已宣布相同，以保持本地化。

var r = 0;

如果您在循环中执行此操作，则无需在此处初始化r（即为其指定值）。

tbl = document.getElementById("matrix");

for(r = 0; r < tbl.rows.length; r++) {
    var _tempmg = tbl.rows[r].cells[col].childNodes[0].src;

    if (!_tempmg) break;

在你的html中，你还没有为图像src属性赋值，所以我原本以为你会根据点击它的人分配一个naught或cross。分配了合适的图像后，我会执行下一行。

    if (_img.src != _tempmg) break;
    same = true;

为for（...）表达式添加条件可能更清楚，如：

for(r = 0; r < tbl.rows.length && !same; r++) {

现在可以使用：

而不是休息

    if (_img.src == _tempmg) same = true;

}

if (r == tbl.rows.length && same) {
    alert(_img.src + "won");
    return;
}

same = false;

我需要查看更多 imageClicked 函数，以了解它无法正常工作的原因。

如何检查Tic-Tac-Toe Winner

2 个答案: