Question

我编写了这种方法，将卡面朝上翻转onClick，然后显示alert方法。但是，由于某些原因，当我点击卡片时，它会保持面朝下并显示alert方法。然后，一旦我关闭警报，卡就会翻转。

如何将卡片翻转然后显示alert？

...
newCard.addEventListener('click', flipCard);
...

//method to flip card face up
function flipCard() {

    cardsInPlay.push(this.getAttribute('data-card'));

    if(this.getAttribute('data-card') == 'king'){
        this.innerHTML = '<img src="my_king.png" alt="King of Spades" />';
    } 

    if(this.getAttribute('data-card') == 'queen'){
        this.innerHTML = '<img src="my_queen.png" alt="Queen of Spades" />';            
    }

    if (cardsInPlay.length === 1) {
        alert("Congrats, you flipped a card");
      }

}

Answer 1

据我所知，正确的方法是使用promises和callbacks。

https://www.sencha.com/blog/asynchronous-javascript-promises/

这样你就可以运行一个只在完成一些工作后才创建警报的函数，即你已经改变了当前卡的innerHtml。

狡猾的方式会做出类似的事情：

setTimeout(function() { 
    alert("Congrats, you flipped a card");
}, 500);

Javascript - 点击事件之前的警报显示

1 个答案: