jquery-qrcode.js 生成二维码并支持下载到本地

最新推荐文章于 2024-08-21 08:50:28 发布

longhuaiwen_1991

最新推荐文章于 2024-08-21 08:50:28 发布

阅读量3.2k

点赞数 1

分类专栏：前端文章标签： qrcode.js js

本文链接：https://blog.csdn.net/longhuaiwen_1991/article/details/103404655

版权

本文介绍了如何利用jquery-qrcode.js库在前端生成二维码，并实现二维码的下载功能。通过设置渲染方式、尺寸和颜色，生成的二维码将显示在canvas元素中，点击按钮可以将二维码保存为本地图片。

摘要由CSDN通过智能技术生成

jquery-qrcode.js 生成二维码并支持下载到本地

jquery-qrcode.js 引入

直接上代码。
1、前端代码

                <div class="code-window">
                    <div class="code-main">
                        <div class="codeImg" id="event_qrcode"></div>
                        <div class="codeBtn">
                            <span class="coryCode">保存</span>
                            <span class="cancel">关闭</span>
                        </div>
                    </div>
                </div>

2、生成二维码的js代码,在点击事件中调用此方法，生成的二维码会以画布标签canvas显示在id="event_qrcode"的div中

function createQrcode(ur,src) {
$(’#event_qrcode’).qrcode({
render:“canvas”, //设置渲染方式，有table和canvas，使用canvas方式渲染性能相对来说比较好
text: url, //扫描二维