qrcode 生成二维码

Demo：

qrcodeGithub 地址：

<!DOCTYPE html>

<html>

<head>

    <meta charset="UTF-8">

    <title>qrcode生成二维码</title>

    <meta name="viewport" content="width=device-width, initial-scale=1">

    <link rel="stylesheet" href="../plugins/bootstrap-4.1.3-dist/css/bootstrap.min.css">

    <script src="../plugins/echarts/jquery.min.js"></script>

    <script src="../plugins/bootstrap-4.1.3-dist/js/bootstrap.min.js"></script>

    <script type="text/javascript" src="js/jquery.qrcode.min.js"></script>

</head>

<body>

    <div class="alert alert-primary" role="alert" style="text-align: center;margin:10px;">

        <b>生成的二维码如下:</b>

    </div>

    <div id="qrCodeDiv" style="text-align: center; margin:40px;">

        <img id="qrCodeIco" src="logo.png" style="position: absolute;width: 64px; height: 64px;" />

    </div>

</body>

<script type="text/javascript">

function utf16to8(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;

};

$("#qrCodeDiv").qrcode({

    render: "canvas", //渲染方式有table方式（IE兼容）和canvas方式

    width: 260, //宽度

    height: 260, //高度

    text: utf16to8("https://www.cnblogs.com/hglibin/"), //内容

    typeNumber: -1, //计算模式

    correctLevel: 2, //二维码纠错级别

    background: "#ffffff", //背景颜色

    foreground: "#000000" //二维码颜色

});

var margin = ($("#qrCodeDiv").height() - $("#qrCodeIco").height()) / 2; //控制Logo图标的位置

$("#qrCodeIco").css("margin", margin);

</script>

</html>

运行结果：

qrcode 生成二维码的更多相关文章

  1. C# 利用QRCode生成二维码图片

    网上生成二维码的组件是真多,可是真正好用的,并且生成速度很快的没几个,QRCode就是我在众多中找到的,它的生成速度快.但是网上关于它的使用说明,真的太少了,大都是千篇一律的复制粘贴.这是本要用它做了 ...

  2. Qrcode生成二维码的参数总结 及最小尺寸的测试

    Qrcode生成二维码,做过很多实验,探索最小规格的二维码到底是多少尺寸,和最高规格的二维码到底是多大尺寸.现在我总结总结: 有两种思路: 1.生成规格高的二维码,然后压缩到自己想要的尺寸的二维码.这 ...

  3. 使用jquery.qrcode生成二维码及常见问题解决方案

    转载文章  使用jquery.qrcode生成二维码及常见问题解决方案 一.jquery.qrcode.js介 jquery.qrcode.js 是一个纯浏览器 生成 QRcode 的 jQuery ...

  4. C#Qrcode生成二维码支持中文,带图片，带文字

    C#Qrcode生成二维码支持中文带图片的操作请看二楼的帖子,当然开始需要下载一下C#Qrcode的源码 下载地址 : http://www.codeproject.com/Articles/2057 ...

  5. python_使用qrcode生成二维码

    1.功能 使用qrcode生成二维码 2.代码 #生成二维码: import qrcode #根据url生成二维码 def qrcodeWithUrl(url): img = qrcode.make( ...

  6. 使用jquery.qrcode生成二维码实现微信分享功能

    前言: 最近有个这样的需求,在pc端的商品详情页增加分享功能. 微博分享.QQ好友分享.QQ空间分享这些都很常见.但是微信分享我还没有手动写过(以前改过). 最终效果如下图: 解决方案:使用jquer ...

  7. QRCode生成二维码，jq QRCode生成二维码，QRCode生成电子名片

    [QRCode官网]http://phpqrcode.sourceforge.net/ PHP QRCode生成二维码 官网下载QRCode源码包,引入源码包中的 qrlib.php . <?p ...

  8. 使用jquery.qrcode生成二维码（转）

    jQuery 的 qrcode 插件就可以在浏览器端生成二维码图片. 这个插件的使用非常简单: 1.首先在页面中加入jquery库文件和qrcode插件. <script type=" ...

  9. 使用QRCode生成二维码

    第一步: 获取QRCode组件 可以通过vs的nuget管理安装Gma.QrCodeNet, 也可以直接添加"Gma.QrCodeNet.Encoding.dll"的引用. 第二步 ...

随机推荐

  1. 金牌架构师：我们是这样设计APP数据统计产品的

    前言:近期,智能大数据服务商“个推”推出了应用统计产品“个数”,今天我们就和大家来谈一谈个数实时统计与AI数据智能平台整合架构设计. 很多人可能好奇,拥有数百亿SDK的个推,专注消息推送服务多年,现在 ...

  2. is_int is_float 判断数值是否为整数

    is_float — 检测变量是否是浮点型 http://cn.php.net/manual/zh/function.is-float.php is_int — 检测变量是否是整数 http://cn ...

  3. Nexus(Maven仓库私服)安装

    一.Nexus介绍 Nexus 是Maven仓库管理器,如果你使用Maven,你可以从Maven中央仓库 下载所需要的构件(artifact),但这通常不是一个好的做法,你应该在本地架设一个Maven ...

  4. libuv移植到android

    编译环境是linux + ndk,你要先添加好NDK路径的环境变量,然后进入libuv目录执行以下两句完成编译. $ source ./android-configure $NDK gyp $ mak ...

  5. 跟我一起写Makefile(七)

    make 的运行—————— 一般来说,最简单的就是直接在命令行下输入make命令,make命令会找当前目录的makefile来执行,一切都是自动的.但也有时你也许只想让make重编译某些文件,而不是 ...

  6. 在vue中使用animate.css

    animate.css是一款前端动画库,相似的有velocity-animate 用法: 首先 npm install animate.css --save 然后在vue文件的script中引入: i ...

  7. zTree使用技巧与详解

    zTree--Jquery 树插件,是在后台管理页面中常使用到的插件. 使用效果图: 核心代码: zTree配置: var setting = { data:{simpleData:{enable:t ...

  8. Productivity tips, tricks and hacks for academics (2015 edition)

    Productivity tips, tricks and hacks for academics (2015 edition) Contents Jump to: My philosophy: Op ...

  9. Spark RDD中的aggregate函数

    转载自:http://blog.csdn.net/qingyang0320/article/details/51603243 针对Spark的RDD,API中有一个aggregate函数,本人理解起来 ...

  10. 【AtCoder】ARC086 E - Smuggling Marbles

    [题目]E - Smuggling Marbles [题意]给定n+1个点的树(root=0),每个点可以选择放或不放弹珠,每一轮顺序进行以下操作: 1.将根节点0的弹珠加入答案. 2.每个点的弹珠移 ...