Question

所以，这是一个奇怪的。我有一个带有CSS / HTML按钮的网页。当我按下按钮时，页面冻结。它不会崩溃，只是冻结（点击后按钮应该淡出）。此外，我无法打开JavaScript（或f12）控制台，我无法重新加载页面。在页面上，即使我将鼠标移开按钮或任何可点击的鼠标，鼠标仍然会显示为指针。但是，我仍然可以移动鼠标，退出选项卡，转到另一个选项卡，打开选项卡，然后切换全屏页面。
这是我的HTML：

<!DOCTYPE HTML>
<html lang="en-US">
    <head>
        <meta charset="utf-8">
        <title>Agent Bubble Popper</title>
        <link href="CSS/main.css" rel="stylesheet">
        <script src="https://code.jquery.com/jquery-3.2.1.js"></script>
        <script src="JS/game.js"></script>
        <script src="JS/ui.js"></script>
        <script src="JS/bubble.js"></script>
        <script src="JS/sprite.js"></script>
        <script src="JS/board.js"></script>
        <script src="JS/renderer.js"></script>
    </head>
    <body>
        <canvas id="canvas" width="750" height="500"></canvas>
        <div id="page">
            <div id="topFrame"></div>
            <div id="game">
                <div id="board"></div>
                <div id="bubblesRemaining"></div>
            </div>
            <div id="info"></div>
            <div id="bottomFrame"></div>
            <div id="startGame" class="dialog">
                <div id="startGameMessage">
                <h2>Start a new game</h2>
            </div>
            <div class="butStartGame button">
                New Game
            </div>
            <div class="butInfo button">
                Bubble Info
            </div>
            </div>
        </div>
        <script>
            var game = new bubbleShoot.game();
            game.init();
        </script>
    </body>
</html>

（有问题的按钮是“butStartGame按钮”，它实际上是一个div，但就像一个按钮。另外，“butInfo按钮”不会冻结页面。
这是我的JavaScript（所有变量都已定义，这只是与按下按钮有关的部分。

        this.init = function() {
            $(".butStartGame").on("click", startGame);
            $(".butInfo").on("click", startInfo);
        }
        function startGame(){
            $(".butStartGame").off("click", startGame);
            bubbleAmt = maxBubbles;
            bubbleShoot.ui.hideDialog();
            curBubble = getNextBubble();
            board = new bubbleShoot.board();
            bubbles = board.getBubbles();
            if (!requestAnimationID) {
                requestAnimationID = setTimeout(renderFrame, 40);
            };
            $("#page").on("click", clickGameScreen);
        }

BTW抱歉格式化，我正在从我的文件中复制这个，这不是我的所有代码关于我的代码中的“var game = new bubbleShoot.game，game.init”部分：我在这里显示的JavaScript全部包含在“bubbleShoot.game”中，因此运行“game.init”只是运行“this.init”代码中显示。
我的问题很简单，就是“为什么我的网页会冻结？”

Answer 1

就目前的问题而言，它听起来像startGame ()中的一个函数被卡在无限循环中

尝试调试并放置一些console.log ("getNextBubble ()")如果你开始看到函数的名称，那么一旦你处于无限循环中

如果这不能解决您的问题，我强烈建议您使用更多详细信息更新您的问题

按下按钮

1 个答案: