添加二维码并下载二维码

页面内加二维码并下载


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">  
<html>  
    <head>  
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">  
        <title>js_canvas_download</title>  
        <script type='text/javascript' src='http://cdn.staticfile.org/jquery/2.1.1/jquery.min.js'></script>  
        <script type="text/javascript" src="http://cdn.staticfile.org/jquery.qrcode/1.0/jquery.qrcode.min.js"></script>  
    </head>  
    <body>  
        <div id="qrcode"></div>  
        <a id="download" download="qrcode.jpg"></a>  
        <button id="save">save</button>  
    </body>  
</html>  
<script>  
    jQuery('#qrcode').qrcode({width: 500,height: 500,text: "http://www.baidu.com"});  
      
    $("#save").click(function(){  
        var canvas = $('#qrcode').find("canvas").get(0);  
        var url = canvas.toDataURL('image/jpeg');  
        console.log(url);
        $("#download").attr('href', url).get(0).click();  
        return false;  
    });  
</script>  
posted @ 2017-10-18 14:36  李美玲  阅读(224)  评论(0编辑  收藏  举报