Question

我正在使用Canvas制作一个JavaScript游戏。但是，我得到了该错误（下图），并且未显示背景图像。我怀疑以下4个文件，因为其他文件没有造成任何麻烦。我想这个问题与game_state有关...我该如何解决这个问题呢？我苦了两天：(请帮帮我..

error image1

error image2

index.html

<!DOCTYPE html>
<html lang="ko">

<head>
 <meta charset="utf-8">
 <title>Lion Travel</title>

 <!--GameFramework-->
 <script src="/.c9/gfw/GameFramework.js"></script>
 <script src="/.c9/gfw/FrameCounter.js"></script>
 <script src="/.c9/gfw/InputSystem.js"></script>
 <script src="/.c9/gfw/SoundManager.js"></script>
 <script src="/.c9/gfw/GraphicObject.js"></script>
 <script src="/.c9/gfw/SpriteAnimation.js"></script>
 <script src="/.c9/gfw/ResourcePreLoader.js"></script>
 <script src="/.c9/gfw/DebugSystem.js"></script>
 <script src="/.c9/gfw/Timer.js"></script>
 <script src="/.c9/gfw/FrameSkipper.js"></script>
 <script src="/.c9/gfw/TransitionState.js"></script>

 <!--GameInit-->
 <script src="/.c9/gfw/gfw.js"></script>

 <!--Game Logic-->
 <script src="/.c9/RS_Title.js"></script>

</head>

<body>
    <canvas id="GameCanvas" width="800" height="600">html5 canvas is not supported.</canvas>
</body>
</html>

gfw.js

function onGameInit() {
    document.title = "Lion Travel";

    GAME_FPS = 30;
    debugSystem.debugMode = true;

    resourcePreLoader.AddImage("/.c9/title_background.png");
    soundSystem.AddSound("/.c9/background.mp3", 1);

    after_loading_state = new TitleState();
    setInterval(gameLoop, 1000 / GAME_FPS); 
}

window.addEventListener("load", onGameInit, false);

RS_Title.js

function TitleState() 
{
    this.imgBackground = resourcePreLoader.GetImage("/.c9/title_background.png");
    soundSystem.PlayBackgroundMusic("/.c9/background.mp3");
    return this; 
}

TitleState.prototype.Init = function()
{
    soundSystem.PlayBackgroundMusic("/.c9/background.mp3");
};

TitleState.prototype.Render = function()
{
    var theCanvas = document.getElementById("GameCanvas");
    var Context = theCanvas.getContext("2d");

    //drawing backgroundimage
    Context.drawImage(this.imgBackground, 0, 0);
};

TitleState.prototype.Update = function()
{

};

GameFramework.js

var GAME_FPS;
var game_state = after_loading_state;

function ChangeGameState(nextGameState)
{
    //checking essential function
    if(nextGameState.Init == undefined)
        return;

    if(nextGameState.Update == undefined)
        return;

    if(nextGameState.Render == undefined)
        return;

    game_state = nextGameState;

    game_state.Init();
}

function Update() 
{
    timerSystem.Update();

    game_state.Update();

    debugSystem.UseDebugMode();
}

function Render()
{
    //drawing
    var theCanvas = document.getElementById("GameCanvas");
    var Context = theCanvas.getContext("2d");

    Context.fillStyle = "#000000";
    Context.fillRect(0, 0, 800, 600);

    //game state
    game_state.Render();

    if(debugSystem.debugMode)
    {
        //showing fps
        Context.fillStyle = "#ffffff";
        Context.font = '15px Arial';
        Context.textBaseline = "top";
        Context.fillText("fps: "+ frameCounter.Lastfps, 10, 10);
    }
}

function gameLoop()
{
    Update();
    Render();

    frameCounter.countFrame();
}

Answer 1

这里的问题是，甚至在初始化#include "file2.h"之前（仅在加载文档后才对其进行初始化），正在使用对象game_state初始化after_loading_state。因此，after_loading_state仍为game_state。

要解决此问题，请将GameFramework.js中的undefined更改为var game_state = after_loading_state;。并将var game_state;添加为game_state = after_loading_state;函数的第一行。这样，变量的初始化将以正确的顺序进行。

javascript：未捕获的参考错误

1 个答案: