javascript - 有时 HTML5 画布可以工作并显示图像，有时在 IE9 上不能

Question

有时 HTML5 画布可以工作并显示图像，有时它不能在 IE9 上用于此网页：https ://www.barnwellmd.com/PainDiagram/PainDiagram.html 。它始终适用于 Firefox 和 Chrome。

谁能看到我做错了什么？

这是加载图像的js代码：

function init () {
// Find the canvas element.
canvas = document.getElementById('imageView');
if (!canvas) {
  alert('Error: I cannot find the canvas element!');
  return;
}

if (!canvas.getContext) {
  alert('Error: no canvas.getContext!');
  return;
}

// Get the 2D canvas context.
context = canvas.getContext('2d');
if (!context) {
  alert('Error: failed to getContext!');
  return;
}
var img=new Image();
img.onload = function(){
context.drawImage(img,0,0);
imageData = context.getImageData(0, 0, 700, 643);
pixels = imageData.data;
};
img.src="PainDiagram.png";
    ...

Answer 1

我认为如果你交换这两个代码块，就像我在下面所做的那样，它应该得到修复：

// Get the 2D canvas context.
context = canvas.getContext('2d');
if (!context) {
  alert('Error: failed to getContext!');
  return;
}


if (!canvas.getContext) {
  alert('Error: no canvas.getContext!');
  return;
}