画布元素在不应该改变颜色的时候？

Question

我正在尝试制作HTML5帆布棋盘游戏。

我为我的项目制作了一个JSFiddle：https://jsfiddle.net/0q6thfq8/

以下是我认为可能导致此问题的功能:(第77行）

this.drawCheckers = function() {
    this.drawSquares();
    for(var checker of this.checkers) {
        checker.draw();         
    }
    if(this.selection != null) {
        ctx.strokeStyle = "green";
        ctx.lineWidth = "5";
        ctx.rect(this.selection.x,this.selection.y,64,64);
        ctx.stroke();
    }
}

出于某种原因，在选择检查器时，最后一个黑色检查器会显示绿色轮廓。

由于我遇到的问题的独特性，我很难找到其他论坛帖子和网站来讨论这个问题。

有人能解释一下这个问题吗？感谢。

Answer 1

添加TableB.Id：

TableA

<强> Fiddle

这将在绘制新选择之前清除路径。否则将包含旧路径内容。

另请注意，beginPath()在某些浏览器中需要polyfill。