Easel.js > 这段代码有什么问题？答案

【问题标题】：Easel.js > What is wrong with this code?Easel.js > 这段代码有什么问题？
【发布时间】：2012-04-13 05:13:00
【问题描述】：

这段代码有什么问题？ :S.. 我的画布是空的。图片 URL 正确，图片已加载。

这是我的 engine.js 文件：

var canvas;
var stage;

function init()
{
    canvas = document.getElementById("canvas");
    stage  = new Stage(canvas);

    playerImg        = new Image();
    playerImg.src    = 'img/player/walkingbl.png';
    playerImg.onload = onPlayerLoaded;

    Ticker.setFPS(30);
    Ticker.addListener(window);
}

function tick()
{
    stage.update();
}

function onPlayerLoaded()
{
    console.log(playerImg);
    player      = new Bitmap(playerImg);
    player.x    = 300;
    player.y    = 450;

    stage.addChild(player);

    console.log('Player added to stage');
}

$(document).ready(function(){

init();

});

这是我的 index.html 文件：

<!DOCTYPE html>
<html>
<head>
          <title>Game Engine</title>
          <link rel="stylesheet" href="css/main.css" />
</head>
<body>
      <div id='container'>
           <canvas id='#canvas' width='1000' height='350'></canvas>
      </div>

            <script src="js/jquery.js"></script>
            <script src="js/easel.js"></script>
        <script src='js/engine.js'></script>
</body>

我对整个easel.js 很陌生，从未对Flash 或actionscript 做过任何事情。我是一名 PHP 开发人员，所以这对我来说是一个很大的转变。缺乏文档/教程/示例，让我很难学习如何使用easel.js。因此，如果您有任何指示或资源供我查看。请分享！

【问题讨论】：

浏览器控制台有错误吗？
不，没有。它完美地记录了图像和“添加到舞台的玩家”..

标签： html canvas easeljs

【解决方案1】：

这一行是错误的：

<canvas id='#canvas' width='1000' height='350'></canvas>

ID 不需要#。右边是：

<canvas id='canvas' width='1000' height='350'></canvas>

但我不会使用“画布”一词作为标识符，因为它可能与标签混淆。更好的使用：

<canvas id='mycanvas' width='1000' height='350'></canvas>

并更改 JS 代码：

canvas = document.getElementById("mycanvas");

【讨论】：

你忠实于你的名字。非常感谢队友。不敢相信我怎么忽略了这个 xD。