0

テーブルを使ってチェッカーボードを作りました。セルの x 座標と y 座標を取得したい。しかし、this.parentNode.rowIndex私に-1を与え続けます。エラーを探すのに数え切れないほどの時間を費やしました。誰かが私のためにそれを見つけることができますか?

var board = [[1, 0, 1, 0, 1, 0, 1, 0],
         [0, 1, 0, 1, 0, 1, 0, 1],
         [1, 0, 1, 0, 1, 0, 1, 0],
         [0, 0, 0, 0, 0, 0, 0, 0],
         [0, 0, 0, 0, 0, 0, 0, 0],
         [0, -1, 0, -1, 0, -1, 0, -1],
         [-1, 0, -1, 0, -1, 0, -1, 0],
         [0, -1, 0, -1, 0, -1, 0, -1]];

var gray = -1; //distinguishing players
var red = 1;

function makeBoard() {
//create a table
var tbl = document.createElement("table");
//create a <tr> for each row
for (var i = 0; i < 8; i++) {
    var tr = document.createElement("tr");

    //create a <td> for each column
    for (var j = 0; j < 8; j++) {
        var td = document.createElement("td");
        //setting the attributes of a square
        td.setAttribute("width", "50");
        td.setAttribute("height", "50");
        if ((i % 2 == 0 && j % 2 != 0) || (i % 2 !=0 && j % 2 == 0)) {
            td.style.backgroundColor = "black";
        }
        else if (board[i][j] == red) {
            td.style.backgroundColor = "red";
        }
        else if (board[i][j] == gray) {
            td.style.backgroundColor = "gray";
        }
        td.onclick = function() {
            alert(this.cellIndex + ", " + this.parentNode.rowIndex); //RETRIEVING WRONG COORDINATES
        }
        tr.appendChild(td);
    }
    tbl.appendChild(tr);
}
tbl.setAttribute("border", "10");
return tbl;
}

何かが足りないと感じた場合は、お知らせください。

4

2 に答える 2

1

使ってみて

sectionRowIndexただの代わりにindex..

ChromeとFirefoxの両方で正常に動作しているようです

this.parentNode.sectionRowIndex

フィドルをチェック

于 2012-11-12T22:13:58.977 に答える
1

この場合、欠落している tbody は実際には問題ではないようです。これは、行とセルが追加される方法に関連しているようです。

appendChild を使用する代わりに、table.insertRow および row.insertCell メソッドを使用する必要があります。

したがって、行を追加するときは、代わりに

var tr = document.createElement("tr");

使用する

var tr = tbl.insertRow(0);

セルにも同じことが適用されます。

var td = tr.insertCell(j);

また、ブロックの最後にある tr と td の両方の appendChild 呼び出しを削除します

ここでの作業修正http://jsfiddle.net/nBbd2/30/

于 2012-11-12T22:19:55.383 に答える