Question

这是纸牌游戏的一部分，当6张纸牌中有2张被翻转并且是一场比赛时，我需要将其替换为“ clear.png”，以便它们看起来像消失了一样。如果不匹配，我想在1.5秒后将其替换为img“ back.png”。一次只能翻转两张卡。

当我尝试通过翻转访问“ src”时，我尝试使用getElementsByTagName”而不是getElementsById，这一次，错误没有出现，但是它什么也没做（setTimeout不会超时）。

我查看了与此相关的其他问题，但是这些帖子中似乎没有建议。谢谢您的帮助。这是我的HTML及其下面的.js的一部分：

    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8" />
    <title></title><style> 
            img {margin: 10px;}
        </style>
        <script src="matching.js" defer></script>
        </head>
        <body>
            <div id="matchingcards"></div>
            <input id="restart" type="submit" value="Restart Game">

        </body>
        </html>

    <script>
    ......
    var flipped = [];
    function flipcards(card, value) {
    if(card.getAttribute("src") == "back.png" && flipped.length < 2){
        console.log(card.getAttribute("src"))
        console.log("get attribute back.png")
        card.src = value;

        if(flipped.length == 0){ flipped.push(value); } 
        else if(flipped.length == 1) {
            flipped.push(value);
            if(flipped[0].charAt(0) == flipped[1].charAt(0)) {
                setTimeout(() => {
                    document.getElementById(flipped[0]).src = "clear.png";
                    document.getElementById(flipped[1]).src = "clear.png";
                    flipped = [];
                }, 1500);
            } else {
                if(flipped.length == 2){
                    setTimeout(() => {
                        document.getElementById(flipped[0]).src = "back.png";
                        document.getElementById(flipped[1]).src = "back.png";
                        flipped = [];
                    }, 1500);
                }
            }
        }
    }
} 
</script>

无法在setTimeout上将属性'src'设置为null

0 个答案: