我想在我的网页中放置一个图像，但是当我点击刷新按钮时图像一直消失。我检查了其他 SO 问题，其中提到我们必须添加一个名为 window.onload=yourDrawFunction() 的行，我这样做了，但我仍然有问题。这是我的代码。
<!DOCTYPE html>
<html>
<head>
<title>Transformation Demo</title>
<style type="text/css">
.hidden{
display: none;
}
</style>
</head>
<body>
<h1>Tranformation Demo</h1>
<img class = "hidden" id="goku" width="220" height="277" src="goku.jpg" alt="Goku Pic">
<canvas id="surface" width=400 height=400>
Your browser doesn't support canvas tag.
</canvas>
<script>
function draw(){
var drawing=document.getElementById("surface");
var con=drawing.getContext("2d");
var gokupic=document.getElementById("goku");
con.save();
con.translate(100,100);
con.rotate(Math.PI / 4);
con.scale(3.0,1.5);
con.drawImage(gokupic, -25,-25,50,50);
con.restore();
con.strokeStyle="red";
con.lineWidth=5;
con.strokeRect(0,0,200,200);
}
window.onload=draw();
</script>
</body>
</html>
谢谢
注意:我的图像没有问题，但如果我只是这样做，它就可以正常工作。
window.onload=function(){
...
...
...
...
而不是给我的函数取一个名为 draw 的名称，然后调用它。那么为什么它可以工作，为什么我的 draw() 函数不工作？
最佳答案
这是解释，为什么 window.onload = someFunction() 不工作，window.onload = someFunction 工作。
window.onload = someFunction()
将“onload”变量设置为调用 someFunction 的结果。除非“someFunction”本身返回一个函数，否则这可能不是您想要的。
默认情况下，使用单个“事件”参数调用 onload 函数。如果你想传递参数，你可以这样做:
window.onload = function (event) {
someFunction(someArg, someOtherArg)
}
有关更多详细信息，请参阅此 link
关于javascript - 即使在 javascript 中有 onload 事件，如何阻止 Canvas Image 消失？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/37381072/