[英]HTML5 Canvas no method 'toDataURL'
My Code is like this 我的代码是这样的
<html>
<head>
</head>
<body>
<canvas id="myCanvas" width="578" height="200" style="display:none;"></canvas>
<img id="canvasImg" onclick="myFunction()" alt="Right click to save me!">
<script>
var canvas = document.getElementById('myCanvas');
var context = canvas.getContext('2d');
function myFunction() {
var c = document.getElementsByTagName("canvas");
// save canvas image as data url (png format by default)
var dataURL = c.toDataURL();
// set canvasImg image src to dataURL
// so it can be saved as an image
document.getElementById('canvasImg').src = dataURL;
}
</script>
</body>
</html>
When i click on canvasImg
its throwing an error 当我单击canvasImg
抛出错误
Uncaught TypeError: Object #<NodeList> has no method 'toDataURL'
I have made a fiddle here Can any one point out whats going wrong? 我在这里弄了个小提琴,有人能指出出什么问题了吗?
document.getElementsByTagName
returns array of elements objects, and no array objects have method toDataUrl document.getElementsByTagName
返回元素对象的数组,并且没有数组对象具有toDataUrl方法
instead of this 代替这个
var c = document.getElementsByTagName("canvas");
use 采用
var c = document.getElementsByTagName("canvas")[0];
function myFunction() {
var canvas = document.getElementById("myCanvas");
var context = canvas.getContext("2d");
var img = document.getElementById("canvasImg");
context.drawImage(img, 0, 0);
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.