Programmiererforum

HTML -Code < /p>




Memory Game






Reset Game





< /code>
JS -Code < /p>
const cards = document.querySelectorAll('.card')
let clickCount = 0
let id = []
let matched = 0

function shuffle(){
cards.forEach(card => {
let pos = Math.floor(Math.random() * 12);
card.style.order = pos
})
}

shuffle()

function checkMatch(){
if (id[0] == id[1]){
return true
}else{return false}
}

cards.forEach(card=>{
card.addEventListener('click', ()=>{
card.innerHTML = card.id
id.push(card.id)
card.setAttribute('open', 'true')
clickCount += 1
console.log(clickCount)
if (clickCount == 2){
let result = checkMatch()
clickCount = 0
if (result == false){
id = []
setTimeout(()=>{document.querySelectorAll('[open="true"]').forEach((card)=>{card.innerHTML='';card.removeAttribute('open', 'true')})},100)
}else{
console.log('matched')
id = []
document.querySelectorAll('[open="true"]').forEach((card)=>{card.removeAttribute('open', 'true');card.replaceWith(card.cloneNode(true))})
matched += 2
}
}
if (matched == 16){
console.log('You win')
}
})
})

< /code>
Wenn ich langsam auf die Kacheln klicke und das Spiel spiele, das das Spiel richtig funktioniert. Wenn ich jedoch versuchen sollte, superschnelle Fliesen zufällig zu klicken, erklärt sich eine der geklickten Kacheln als übereinstimmend und bleibt geöffnet, auch wenn er nicht übereinstimmt. Wie repariere ich das.>