使用jquery qrcode生成二维码图片分享到朋友圈打印二维码

古城微笑少年丶 2022-05-13 20:09 237阅读 0赞

##                   使用jquery qrcode生成二维码图片分享到朋友圈打印二维码 ##

# #

一、依赖js

1、jquery-3.3.1.min.js ： jQuery

2、jquery.qrcode.min.js ：生成二维码插件

3、jquery.jqprint-0.3.js：打印插件

二、html 部分代码

<input type="text" id="input" placeholder="请输入二维码内容">
    <button id="btnEncode">生成二维码</button>
    <button id="btnImage">生成二维码图片</button>
    <button id="btnPrint" >打印</button>
    
    <hr />
    <div id="code"></div><br>
    <hr />
    <h2>生成的图片位置</h2>
    <img id="image" src="" />

三、js 代码

<script>
        $(function() {
            //生成二维码
            $("#btnEncode").click(function() {
                $("#code").empty();
                var str = $('#input').val();
                str = toUtf8(str);
                $("#code").qrcode({
                    render : "canvas", //table方式
                    width : 200, //宽度
                    height : 200, //高度
                    text : str // 二维码内容
                });
            });
    
        // 生成二维码图片
        $("#btnImage").click(function() {
            var canvas = $("canvas")[0];
            $("#image").attr('src',canvas.toDataURL());
        });
    
        // 打印二维码
        $("#btnPrint").click(function(){
            $("#image").jqprint({
                debug : false,
                importCSS : true,
                printContainer : true,
                operaSupport : false
            });
        });
    
        //识别中文
        function toUtf8(str) {
            var out, i, len, c;
            out = "";
            len = str.length;
            for(i = 0; i < len; i++) {
                c = str.charCodeAt(i);
                if ((c >= 0x0001) && (c <= 0x007F)) {
                    out += str.charAt(i);
                } else if (c > 0x07FF) {
                    out += String.fromCharCode(0xE0 | ((c >> 12) & 0x0F));
                    out += String.fromCharCode(0x80 | ((c >> 6) & 0x3F));
                    out += String.fromCharCode(0x80 | ((c >> 0) & 0x3F));
                } else {
                    out += String.fromCharCode(0xC0 | ((c >> 6) & 0x1F));
                    out += String.fromCharCode(0x80 | ((c >> 0) & 0x3F));
                }
            }
                return out;
        }
    
      });
    </script>

四、总结

1、该教程是前端使用js生成的二维码，若浏览器禁用js，则功能失效。

2、若要使用长按图片识别二维码，分享到xxx功能，则需要生成二维码图片。

3、java服务端生成二维码图片参考：[https://github.com/zxing/zxing][https_github.com_zxing_zxing]

五、源码下载

1、[https://download.csdn.net/download/haha\_sir/10650727][https_download.csdn.net_download_haha_sir_10650727]

参考资料：[https://github.com/jeromeetienne/jquery-qrcode][https_github.com_jeromeetienne_jquery-qrcode]

[https_github.com_zxing_zxing]: https://github.com/zxing/zxing
[https_download.csdn.net_download_haha_sir_10650727]: https://download.csdn.net/download/haha_sir/10650727
[https_github.com_jeromeetienne_jquery-qrcode]: https://github.com/jeromeetienne/jquery-qrcode

发表评论取消回复

表情：

评论列表（有 0 条评论，237人围观）

还没有评论，来说两句吧...

相关阅读

相关 jquery-qrcode生成二维码

一、jquery-query jquery-qrcode是一个为浏览器生成二维码的jquery插件。我们很容易将它集成到我们的应用。该插件也可以独立使用，也比

墨蓝/ 2022年07月16日 10:22/ 0 赞/ 216 阅读

相关 jquery-QRCode生成二维码

下载链接:https://github.com/jeromeetienne/jquery-qrcode github下载方式查看:http://blog.csdn.net/c

蔚落/ 2022年06月16日 09:06/ 0 赞/ 238 阅读

相关 QRCode 生成二维码

QRCode生成二维码直接百度云下载路径:链接: https://pan.baidu.com/s/1i4VVbdb 密码: bshi QRCode解析二维码直接百度云下载路径

分手后的思念是犯贱/ 2022年06月16日 08:48/ 0 赞/ 290 阅读

相关使用jquery.qrcode生成二维码

原文： [https://www.helloweba.com/view-blog-226.html][https_www.helloweba.com_view-blog-22

妖狐艹你老母/ 2022年06月06日 00:13/ 0 赞/ 193 阅读

相关 jquery.qrcode.js 生成二维码

GitHub地址: [https://github.com/jeromeetienne/jquery-qrcode][https_github.com_jeromeetienn

- 日理万妓/ 2022年05月18日 02:28/ 0 赞/ 244 阅读

相关使用jquery qrcode生成二维码图片分享到朋友圈打印二维码

使用jquery qrcode生成二维码图片分享到朋友圈打印二维码一、依赖js 1、jquery-3.3.1.min.js

古城微笑少年丶/ 2022年05月13日 20:09/ 0 赞/ 238 阅读

相关 qrcode二维码生成

带Logo的QR Code(二维码)生成工具，对[node-qrcode][]的再封装，支持Logo，支持调整大小 -------------------- 传送门 :

缺乏、安全感/ 2022年05月09日 13:50/ 0 赞/ 227 阅读

相关 Jquery-qrcode生成二维码

引入jquery和jquery-qrcode <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min

小鱼儿/ 2022年01月30日 04:19/ 0 赞/ 339 阅读

相关 jquery-qrcode二维码生成

\ qrCode 一个生成二维码插件使用demo，支持在二维码里添加logo及将二维码转成图片 HTML代码 <!DOCTYPE html> <html>

忘是亡心i/ 2021年10月19日 04:28/ 0 赞/ 419 阅读

相关 js生成二维码下载二维码 jquery.qrcode.min.js

HTML部分代码 <script src="query-1.10.2.min.js"></script> <script src="jquery.qrcode

柔光的暖阳◎/ 2021年08月28日 23:40/ 0 赞/ 1096 阅读