QRcode

必須使用jQuery!!

套件:https://github.com/jeromeetienne/jquery-qrcode

參考資料:(https://dotblogs.com.tw/wellwind/2016/12/10/front-end-jquery-qrcode)

text 後面的文字就是要寫在QRcode的內容

<html>
    <head>
        <script src="jquery.min.js"></script>
        <script src="jquery.qrcode.min.js"></script>
        <script>
            $(document).ready(function(){
                $("#qrcodeImage").qrcode({text : "122132133"});
            });
        </script>
    </head>
    <body>
        <div id="qrcodeImage">
        </div>
    </body>
</html>

將 canvas 轉 img

參考資料:(https://davidwalsh.name/convert-canvas-image)

// Converts canvas to an image
function convertCanvasToImage(canvas) {
    var image = new Image();
    image.src = canvas.toDataURL("image/png");
    return image;
}

EX:

js

// Converts canvas to an image
function convertCanvasToImage(canvas) {
    var image = new Image();
    image.src = canvas.toDataURL("image/png");
    return image;
}

$(document).ready(function(){
    $("#qrcodeImage").qrcode({text : "122132133"});
    var canvas_ = $("#qrcodeImage canvas")[0];
    var image_ = convertCanvasToImage(canvas_);
    $("#putImage").html(image_);
});

html

<div id="qrcodeImage"></div>

<div id="putImage"></div>
PreviousJSONNext核心概念

Last updated