Javascript 检索不正确的表坐标

我用表格创建了一个跳棋板。我想检索单元格的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;
}

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//杰出的运动员 var-red=1； 函数makeBoard（）{ //创建一个表 var tbl=document.createElement（“表”）； //为每行创建一个 对于（变量i=0；i<8；i++）{ var tr=document.createElement（“tr”）； //为每列创建一个 对于（var j=0；j<8；j++）{ var td=document.createElement（“td”）； //设置正方形的属性 td.setAttribute（“宽度”、“50”）； td.setAttribute（“高度”、“50”）； 如果（（i%2==0&&j%2！=0）| |（i%2！=0&&j%2==0））{ td.style.backgroundColor=“黑色”； } 否则如果（板[i][j]==红色）{ td.style.backgroundColor=“红色”； } else if（板[i][j]==灰色）{ td.style.backgroundColor=“灰色”； } td.onclick=函数（）{ 警报（this.cellIndex+，“+this.parentNode.rowIndex）；//检索错误的坐标 } tr.appendChild（td）； } 附肢儿童（tr）； } tbl.setAttribute（“边界”、“10”）； 返回tbl； } 如果您觉得缺少什么，请告诉我。

尝试使用

sectionRowIndex

而不仅仅是

index

在chrome和Firefox中似乎都运行良好

this.parentNode.sectionRowIndex

---

在这种情况下，丢失的车身似乎不是问题所在。看起来这与添加行和单元格的方式有关

您应该使用table.insertRow和row.insertCell方法，而不是使用appendChild

因此，在添加行时

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

使用

同样适用于单元格，使用

var td = tr.insertCell(j);

同时删除块末尾对tr和td的两个appendChild调用

---

这里的工作补丁

尝试了一个JSFIDLE，在Firefox中工作，在Chrome中失败尝试创建一个

元素并将行元素放在其中。您还可以为我们创建一个JSFIDLE演示来调试一个活动对象。@IanKuca，先生。将

tr

元素添加到

tbody

中似乎可以解决chrome问题。

var td = tr.insertCell(j);