通过JavaScript

时间:2015-10-04 23:23:22

标签: javascript jquery

我已经看到了相当多的关于添加/删除表格行的内容,但关于添加/删除表格单元格并不多。我正在使用一个表来制作正方形网格,然后将正方形组合成矩形(制作类似俄罗斯方块的形状)。我在创建矩形时删除了几个正方形,设置其“索引单元格”的colspan以填充已删除单元格留下的间隙。后来我需要将这个 - 索引单元格反转回正方形,然后用编程生成的新元素替换“缺失”元素。

问题是如果我以后需要为下一个形状删除任何这些生成的单元格,程序找不到它们。我可以在DOM上看到它们甚至检查它们的类/ ID,但是对于程序它们是不可见的(不能通过jQuery id或类选择器选择)。提示:这些单元格的cellindex为-1 - 好像表格认为它们被附加在DOM层次结构中的其他位置。

这是HTML:

                <td class="cell"></td>
                <td class="cell"></td>
                <td class="cell enterBtn" colspan="3" rowspan="1" id="enterBtn"></td>
                <td class="cell"></td>
                <td class="cell"></td>

这是JavaScript在将矩形返回到方形后尝试创建“填充”单元格:

// ======= ======= ======= unMergeArea ======= ======= =======
Game.prototype.unMergeArea = function(whichArea) {
    var indexCell = this.tableCellsArray[whichArea.iR][whichArea.iC];
    $(indexCell).attr("colSpan", 1);
    $(indexCell).attr("rowSpan", 1);
    for (var j = 0; j < whichArea.iH; j++) {
        for (var i = 0; i < whichArea.iW; i++) {
            if (!((i == 0) && (j == 0))) {
                var newCell = document.createElement("td");
                $(indexCell).after(newCell);
                $(newCell).addClass("cell");
            }
        }
    }
    $(indexCell).removeClass(whichArea.class);
    $(indexCell).addClass("cell");
    return indexCell;
}

这里的脚本稍后会删除另一个矩形的单元格来填写。程序找不到“nextCell”:

// ======= ======= ======= mergeArea ======= ======= =======
Game.prototype.mergeArea = function(whichArea) {
    var nextCell;
    var indexCell = this.tableCellsArray[whichArea.iR][whichArea.iC];
    for (var j = 0; j < whichArea.iH; j++) {
        for (var i = 0; i < whichArea.iW; i++) {
            if (!((i == 0) && (j == 0))) {
                nextCell = $(this.tableCellsArray[whichArea.iR + j][whichArea.iC + i]);
                $(nextCell).remove();
                $(nextCell).addClass("gone");
                }
            }
        }
    }
    $(indexCell).attr("colSpan", whichArea.iW);
    $(indexCell).attr("rowSpan", whichArea.iH);
    $(indexCell).addClass(whichArea.class);
    return indexCell;
}

有什么想法?这一直很痛苦!

0 个答案:

没有答案