为什么不显示此HTML5画布？
[英]Why isn't this HTML5 canvas displayed?
问题描述
<!doctype html>
<html>
<head>
<title>Canvas test</title>
</head>
<body>
<script type="text/javascript">
c = getElementById('canvas');
ctx = c.getContext("2d")'
ctx.fillRect(10,10,10,10);
</script>
<canvas id="canvas" height ="100" width = "100"></canvas>
</body>
</html>
我已经在Chrome和IE 9上进行了尝试，但它们都不显示任何内容。 您知道为什么这行不通吗？
这可能是愚蠢的，我的朋友要我发布此消息，因为他太懒了，无法注册，但我自己也无法解决。
4 个解决方案
解决方案1
7 已采纳 2012-11-27 16:56:13
您需要将代码放入onload函数中。
例如：
window.onload = function() {
c = document.getElementById('canvas');
ctx = c.getContext("2d");
ctx.fillRect(10,10,10,10);
};
这样做的原因是因为您的javascrpt代码将在<canvas>呈现之前运行，并且您希望它运行afterwords 。
解决方案2
4 2012-11-27 16:56:38
语法错误在这里：
ctx = c.getContext("2d")'
改成：
ctx = c.getContext("2d");
另外，您需要使用document对象：
c = document.getElementById('canvas');
解决方案3
3 2012-11-27 16:57:37
您缺少“文档”。
var c = document.getElementById('canvas');
解决方案4
2 2012-11-27 16:56:21
运行脚本时画布不存在。 移动<canvas>标记，以便它是前 <script>标记。
为什么我的图像没有在HTML5画布上绘制？
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.