Question

我已经做了相当多的搜索，似乎无法找到我正在寻找的东西，所以这并不是超级重复。我正在使用vanilla javascript制作一个非常简单的记忆游戏（试图远离jquery，这样我就可以了解JS的基础知识）

这是一个小提琴的链接，所以你可以看到整个作品以及我认为给我带来麻烦的功能：https://jsfiddle.net/69kfgxbn/

var showTile = function() {
var tile = document.getElementsByClassName('tile');
var tilesChosen = 0;
console.log(this.style.backgroundColor);
console.log(this);

if (tilesChosen < 2) {
    this.classList.remove('card-back');
    tilesChosen = tilesChosen + 1;
    console.log('under 2');
    console.log(tilesChosen);
}
else if (tilesChosen == 2) {
    tile.removeEventListener('click', function() {
        console.log('hit the max');
    })
}

};

我的问题是我可以点击一个瓷砖，卡片背面类被删除，显示颜色，但我无法弄清楚如何将其限制为仅2个瓷砖。

我目前的思路如下：

tilesChosen设置为零 if语句检查tilesChosen是否＆lt; 2
如果是这样，请将tilesChosen增加1 否则，如果tilesChosen == 2，则删除所有类上的事件处理程序，我认为这会阻止任何人推翻超过2个tile。

但到目前为止，我甚至没有进入elseIf，无论你点击了多少个瓷砖。另外，tilesChosen的增量不会超过1，所以就像我被卡在声明的if部分一样。我也把这个if / else放在for和while循环中，希望强制它循环并测试tilesChosen的值，但它是同样的东西。

你们的任何建议都会非常感激！

Answer 1

var jsBoard = []; var gamePieces = 12; var tilesChosen = 0;

每次单击时，都会将变量tilesChosen重新启动为0，因此它永远不会达到您想要的值。您应该声明为全局tilesChosen

喜欢这个

var jsBoard = [];

var gamePieces = 12; var tilesChosen = 0;

现在您无法点击更多div

如何确保在javascript中只选择了2个div

1 个答案: