二维码到dataURL
我正在尝试使用davidshimjs/qrcodejs生成二维码,代码如下。但是,当我尝试生成DataURL时,它给出以下错误:
TypeError:Document.getElementById(...).toDataURL不是函数
以下是我的代码:
HTML:
<div id="qrcode"></div>
js:
var qrcode = new QRCode("qrcode", {
text: QRId,
width: 200,
height: 200,
colorDark : "#000000",
colorLight : "#ffffff",
correctLevel : QRCode.CorrectLevel.H
});
var dataURL = document.getElementById('qrcode').toDataURL();
解决方案
这是因为toDataURL
仅适用于<canvas>
元素。
canvas.toDataURL(type, encoderOptions);
参见:https://developer.mozilla.org/en-US/docs/Web/API/HTMLCanvasElement/toDataURL
更新
以下是获取数据URL的方式...
数据-lang="js"数据-隐藏="假"数据-控制台="真"数据-巴贝尔="假">var QRId = "123456789"
var qrcode = new QRCode("qrcode", {
text: QRId,
width: 200,
height: 200,
colorDark : "#000000",
colorLight : "#ffffff",
correctLevel : QRCode.CorrectLevel.H
});
// get the qr div, then find the canvas element inside it
var canvas = document.getElementById('qrcode').querySelector('canvas');
var dataURL = canvas.toDataURL();
document.getElementById('result').innerHTML = dataURL;
<script src="https://cdn.rawgit.com/davidshimjs/qrcodejs/master/qrcode.js"></script>
<div id="qrcode"></div>
<div id="result"></div>
相关文章