Javascript 制作记忆匹配游戏-你能用不同的方式显示一张图片吗？

我正在做一个记忆匹配游戏。现在，游戏运行良好。然而，我现在需要在游戏的一部分工作，你实际上必须把牌翻转过来。我首先会有两组图像：“卡的背面”和“卡的正面”。卡的背面都是相同的，然后当你点击其中一个，卡的正面就会显示出来。正面都是独一无二的成对图片。但是，我的代码是这样的，即单击的具有相同源的图片将被删除。因此，一旦你点击图片的任何两个“背面”，它们总是会被删除，不管它们的“正面”是什么

我只想使用一组图片，并在单击时以不同的方式显示它们。抱歉，如果这听起来有点混乱，那是我能解释的最好的方式

以下是我目前的演示：

---

因此，基本上，我需要一种方法来合并一个功能，在这个功能中，你必须翻转两张卡，如果它们匹配，它们将被删除，如果它们不匹配，它们将被翻转回来。

通过显示卡的正面和背面，每一张卡基本上都是两张相互重叠的图像。您也可以使用CSS 3翻转背面

在我看来，您可以使用如下内容在HTML标记中表示该结构：

<div class="card">
    <img class="front" />
    <img class="back" />
</div>

---

。。。然后用它与显示屏上的其他卡进行比较。

看看这个：也许你可以比较图像来源

$('div.card').on('click', function () {
    var _src = $(this).find('.front').attr('src');
});