Javascript - 單擊事件前的提醒顯示

我寫了這種方法，將卡翻轉過來面朝上onClick，然後顯示alert方法。但是，由於某種原因，當我點擊卡時，它會保持正面朝下，並顯示alert方法。然後，一旦我關閉警報，卡片就翻轉過來。Javascript - 單擊事件前的提醒顯示

如何將卡片翻轉過來然後顯示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"); 
     } 

}

來源

2016-11-14 user2456977

設置'src'屬性只在後臺啓動圖像「下載」。下載排隊後腳本將繼續運行。 alert（）函數暫停其他活動的執行。嘗試將警報放在一個簡短的'setTimeout'中。（即'setTimeout（function（）{alert（「Congrats，you flip a card」）}，1）;'）。還有其他方法可以做到這一點 - 比如向圖像的「onload」添加事件處理程序。 – Tibrogargan

從我的理解，正確的方法是使用承諾和回調。

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

這樣，你可以運行它創建經過一番工作已經完成，即你已經修改了當前卡的innerHTML警報功能。

狡猾的辦法是做這樣的事情：

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

來源

2016-11-14 18:42:57

Javascript - 單擊事件前的提醒顯示

回答

相關問題