问题：
在学习HTML5的canvas元素时，我写了如下代码打算将图片绘制到画布：
<body>
<canvas id="canvas" height="1000" width="1000"></canvas>
</body>
<script type="text/javascript">
var canvas = document.getElementById("canvas");
var cxt = canvas.getContext("2d");
var img = new Image();
img.src = "../resourse/cat.jpg";
cxt.drawImage(img, 0, 0);
</script>
但是图片一直无法显示出来。
解决方案
经查阅资料，代码应该这么写：
<body>
<canvas id="canvas" height="1000" width="1000"></canvas>
</body>
<script type="text/javascript">
var canvas = document.getElementById("canvas");
var cxt = canvas.getContext("2d");
var img = new Image();
img.src = "../resourse/cat.jpg";
img.onload = function(){ # drawImage()函数应卸载onload中
cxt.drawImage(img, 0, 0);
}
</script>
如此一来，图片正常显示。