如何解决双击破坏 JS 记忆游戏
当我和我 4 岁的孩子一起测试记忆游戏时,她发现了一个错误。当您双击一张卡片时,它会将其视为匹配项。我尝试禁用已使用 this.style.pointerEvents = 'none'
单击的 ,然后将其设置回自动。
这适用于第二个点击的卡片,但不适用于第一个(破坏了使用它的意义并创建了一个新错误!该项目目前部署在:https://dandavies23.github.io/smoothie-moves/
如果您对我如何做得更好有任何想法,非常感谢!
function tumblerLift() {
let cardId = this.getAttribute('data-id')
this.style.pointerEvents = 'none';
cardsChosen.push(fruitVegArray[cardId].name)
cardsChosenId.push(cardId)
this.setAttribute('src',fruitVegArray[cardId].img)
console.log(fruitVegArray[cardId])
if (cardsChosen.length === 2) {
setTimeout(checkForMatch,500)
this.style.pointerEvents = 'auto';
}
} ```
解决方法
好吧,我想您可以尝试使用另一个这样的 if 语句(基于您的 setAttribute
)
function tumblerLift() {
let cardId = this.getAttribute('data-id')
this.style.pointerEvents = 'none';
cardsChosen.push(fruitVegArray[cardId].name)
cardsChosenId.push(cardId)
if(this.src==fruitVegArray[cardId].img){return null} //image already chosen
this.setAttribute('src',fruitVegArray[cardId].img)
console.log(fruitVegArray[cardId])
if (cardsChosen.length === 2) {
setTimeout(checkForMatch,500)
this.style.pointerEvents = 'auto';
}
}
,
多亏了 an answer by The Bomb Squad,null
解决方案帮助修复了匹配后出现的另一个水果错误。
这是我现在拥有的代码:
// Tumbler lift
function tumblerLift() {
if (this.src.includes('images/blank.png')) {
return null
} // prevents fruit from reappearing,credit Y0urs Truly from Github for helping fix this bug
现在感觉好多了;实际游戏可以在这里玩:https://dandavies23.github.io/smoothie-moves/
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。