Question

建立卡片匹配游戏，完整代码https://codepen.io/3noki/pen/xjyErQ

我正在尝试将卡片转换为列表/数组，或者我猜是变量，所以我可以检查它是否与下一个转换第二张卡片的事件相匹配。但是，这个例子导致了错误，将其放在函数openedCards()中。

let card1 =  $(event.target).toggleClass('open show');

如果有更好的方法将值与后来的值匹配，我还没有学到它，但这是我目前所知道的。

另外，我已经实现了一个计数器，它应该增加到1，然后下一个事件增加到2，如果它们不匹配，重置两个卡，我将能够在之后测试它第一部分有效，但在函数openedCards()中列出。

我认为我正在努力解决的最重要的事情是从DOM中指定或保存第1和第2个事件，或者在数组[此事件]中找出如何引用此事件。

我已经看过其他一些例子，但是尝试过这些例子却没有成功。

assign function

array of functions

代码摘录

function cardFlip(event) { 
    $(event.target).toggleClass('open show') 
    openedCards();
} 

function openedCards(i) { 
    if (openedCardsList.length === 0) {
        openedCardsList.push(i); 
         let card1 = $(event.target).toggleClass('open show');
    } else if (openedCardsList.length === 1) { 
        openedCardsList.push(i); 
        let card2 = $(event.target).toggleClass('open show');
    } else {
        openedCardsList = []; 
        cardFlip(card1);  
        cardFlip(card2);
    }
}

Answer 1

首先，openedCards接受单个参数i。从openedCards调用cardFlip时，您没有将任何值传递给undefined，因此您将openedCardsList推送到$(event.target).toggleClass('open show');。

其次，您在cardFlip和openedCards中都在调用card1。由于您正在切换，因此最好只在需要时切换，而不是在某些情况下切换然后取消切换。

第三，您要在条件的单独块中设置card2和else的值，以便永远不会在function openedCards(i) { if (openedCardsList.length === 0) { openedCardsList.push(i); let card1 = $(event.target).toggleClass('open show'); } else if (openedCardsList.length === 1) { openedCardsList.push(i); let card2 = $(event.target).toggleClass('open show'); } else{ openedCardsList = []; // card1 and card2 are undefined here cardFlip(card1); cardFlip(card2); } }块中定义它们：

myElem.toggle

最后，myElem返回let lastCard = null; function cardFlip(event) { const thisCard = $(event.target); const cardClass = $(event.target).children("i").className; thisCard.toggleClass('open show') if (lastCard) { if (lastCard !== thisCard) { // The cards don't match cardFlip(lastCard); cardFlip(thisCard); } else { // you found a match!!! matchedCards++ } lastCard = null; } else { // This is the first card flipped lastCard = cardClass; } }而不是事件或值，因此您应该跟踪已翻转的卡的类并使用该类进行比较，因为相同卡的类名应始终匹配。< / p>

我将摆脱嵌套函数并使用单个函数跟踪最后一张卡片：

{{1}}

将DOM事件分配给变量或数组

1 个答案: