canvas getContext(“2d”)返回null

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (2)
  • 关注 (0)
  • 查看 (86)

我已经尝试了这几种不同的方式,但我一直陷入同样的​​错误。我之前已将图像加载到画布上,但自从前几天更新Safari以来,出现错误。

我会发布我现在有的,但我已经尝试过使用jQuery,html的onLoad属性等。

var cvs, ctx, img;
function init() {
   cvs = document.getElementById("profilecanvas");
   ctx = cvs.getContext("2d"); /* Error in getContext("2d") */
   img = document.getElementById("profileImg");
   drawImg();
}

function drawImg() {
   ctx.drawImage(img, 0, 0);
}

window.onload = init();

这些ID是正确的,并对应于适当的画布和img标签。但是,我一直在收到TypeError: 'null' is not an object (evaluating 'cvs.getContext'),似乎没有进一步发展。我敢肯定这是一些ID10T错误,但我希望有人能够给我一个线索,是什么导致了这种情况?谢谢。

提问于
用户回答回答于

当你这样做时:

window.onload = init();

该函数init()将立即执行(导致错误的原因,因为getContext()调用得太早,即在DOM被加载之前),并且返回值init()将被存储到window.onload

所以你想要这样做:

window.onload = init;

注意别忘了()

用户回答回答于

对于搜索getContext返回null时打开此页面的其他人,如果你已经请求了不同类型的上下文,则可能会发生这种情况。

例如:

var canvas = ...;
var ctx2d = canvas.getContext('2d');
var ctx3d = canvas.getContext('webgl'); // will always be null

如果你改变呼叫顺序,情况也是如此。

扫码关注云+社区