Javascript 的函数 drawImage() 需要页面重新加载才能工作

Question

我对 javascript 函数 drawImage() 有疑问。它需要重新加载页面才能工作。我的代码：

<canvas id="canva" width="350px" height="350px" style="opacity: 1;"></canvas>    
<script>            
var monImage = new Image();
monImage.src = "https://glacka-industrie.com/Logo-glacka-industrie/logo-basique.png";
monImage.onload = action();

function action() {
  var canvas = document.getElementById("canva");
  var context = canvas.getContext('2d');
  context.drawImage(monImage,20,20,canvas.clientWidth-40,canvas.clientHeight-40);
  var imageData = context.getImageData(0, 0, canvas.width, canvas.height);
  context.putImageData(imageData, 0, 0);
}
</script>```


I tried waiting for the image to load but that didn't work either.

Answer 1

尝试 monImage.onload = action 而不是 monImage.onload = action()

Javascript 的函数 drawImage() 需要页面重新加载才能工作

Javascript's function drawImage() needs the page to reload to work

html

javascript

drawimage