关于canvas无法通过drawImage加载的原因

在使用drawImage方法的时候，发现无法加载

var can = $('#mycanvas')[0];
var cxt = can.getContext('2d');
var bg = new Image();
bg.src = "img/bg.jpg";
cxt.drawImage(bg, 0, 0);

原因是图片的加载时异步的。在资源还没有加载完成的时候就执行了drawImage所以无法成功加载到画布当中。正确的写法应该是保证图片在onload以后才调用drawImage，而不是网上说的window.onload，因为我们的文档中并没有IMG元素

var can = $('#mycanvas')[0];
var cxt = can.getContext('2d');
var bg = new Image();
bg.src = "img/bg.jpg";
//图片资源加载时异步的。必须保证图片资源加载完成后才行
bg.onload = function() {

cxt.drawImage(bg, 0, 0);

}