1.qrious是基于canvas的纯JS二维码生成插件

1.1什么是二维码

二维码又称QR Code,QR全称Quick Response,是一个近几年来移动设备上超流行的一种编码方式,它比传统的Bar Code条形码能存更多的信息,也能表示更多的数据类型。

二维条码/二维码(2-dimensional bar code)是用某种特定的几何图形按一定规律在平面(二维方向上)分布的黑白相间的图形记录数据符号信息的;在代码编制上巧妙地利用构成计算机内部逻辑基础的“0”、“1”比特流的概念,使用若干个与二进制相对应的几何形体来表示文字数值信息,通过图象输入设备或光电扫描设备自动识读以实现信息自动处理:它具有条码技术的一些共性:每种码制有其特定的字符集;每个字符占有一定的宽度;具有一定的校验功能等。同时还具有对不同行的信息自动识别功能、及处理图形旋转变化点。

1.2二维码优势

l 信息容量大, 可以容纳多达1850个大写字母或2710个数字或500多个汉字

l 应用范围广, 支持文字,声音,图片,指纹等等...

l 容错能力强, 即使图片出现部分破损也能使用

l 成本低, 容易制作

1.3二维码容错级别

L级(低) 7%的码字可以被恢复。

M级(中) 的码字的15%可以被恢复。

Q级(四分)的码字的25%可以被恢复。

H级(高) 的码字的30%可以被恢复。

1.4二维码生成插件qrious

qrious是一款基于HTML5 Canvas的纯JS二维码生成插件。通过qrious.js可以快速生成各种二维码,你可以控制二维码的尺寸颜色,还可以将生成的二维码进行Base64编码。

qrious.js二维码插件的可用配置参数如下:

参数

类型

默认值

描述

background

String

"white"

二维码的背景颜色。

foreground

String

"black"

二维码的前景颜色。

level

String

"L"

二维码的误差校正级别(L, M, Q, H)。

mime

String

"image/png"

二维码输出为图片时的MIME类型。

size

Number

100

二维码的尺寸,单位像素。

value

String

""

需要编码为二维码的值

下面的代码即可生成一张二维码

<html>

<head>

<title>二维码入门小demo</title>

</head>

<body>

<img id="qrious">

<script src="qrious.min.js"></script>

<script>

var qr = new QRious({

element:document.getElementById('qrious'),

size:250,    level:'H',    value:'https://www.baidu.com'

});

</script>

</body>

</html>

运行效果:

大家掏出手机,扫一下看看是否会看到百度的首页呢?

插件源码:

链接:https://pan.baidu.com/s/1xS6kanj1mK8kFET1JwyOLw
提取码:5hes

如果失效可以找我,评论私信都会看到的!

留个赞再走呗!

二维码生成插件qrious的更多相关文章

  1. 二维码生成插件qrious及网站扫码登录的一些理解

    什么是二维码 ​ 二维码又称QR Code,QR全称Quick Response,是一个近几年来移动设备上超流行的一种编码方式,它比传统的Bar Code条形码能存更多的信息,也能表示更多的数据类型. ...

  2. jquery二维码生成插件_二维码生成器

    jquery二维码生成插件_二维码生成器 下载地址:jquery生成二维码.rar

  3. Chrome浏览器二维码生成插件

      猛击就可以使用啦->>>猛击使用   源码如下: 源码打包   源码: jquery-2.1.3.min.js jquery.qrcode.min.js https://gith ...

  4. 基于jquery二维码生成插件qrcode

    1.首先在页面中加入jquery库文件和qrcode插件. ? 1 2 <script type="text/javascript" src="jquery.js& ...

  5. jquery二维码生成插件jquery.qrcode.js

    插件描述:jquery.qrcode.js 是一个能够在客户端生成矩阵二维码QRCode 的jquery插件 ,使用它可以很方便的在页面上生成二维条码. 转载于:http://www.jq22.com ...

  6. js 二维码生成 插件

    <div onclick="liaotian()">点击生成二维码</div><div id="qrcode"></d ...

  7. 修改二维码生成插件jquery.qrcode.js支持加入自定义LOGO

    1,将jquery.qrcode.min.js和jquery添加到您的网页中 <script src="jquery.min.js"></script> & ...

  8. Chrome 插件——二维码生成笔记

    原来用了几个生成二维码的插件,总是遇见各种问题……最后索性自己弄一个,这里顺便记录一下. Chrome 插件很开放!!!你只要拿到了crx文件,然后把文件的后缀名改为zip,就可以解压了,最后一切的一 ...

  9. HTML-DEV-ToolLink(常用的在线字符串编解码、代码压缩、美化、JSON格式化、正则表达式、时间转换工具、二维码生成与解码等工具,支持在线搜索和Chrome插件。)

    HTML-DEV-ToolLink:https://github.com/easonjim/HTML-DEV-ToolLink 常用的在线字符串编解码.代码压缩.美化.JSON格式化.正则表达式.时间 ...

随机推荐

  1. Scala函数式编程(四)函数式的数据结构 上

    这次来说说函数式的数据结构是什么样子的,本章会先用一个list来举例子说明,最后给出一个Tree数据结构的练习,放在公众号里面,练习里面给出了基本的结构,但代码是空缺的需要补上,此外还有预留的test ...

  2. 01 jQuery配置、jQuery语法结构、jQuery对象与DOM对象的互相转换

    配置jQuery环境 下载jQuery    官网:jquery.com 学习或开发建议选择未压缩版,便于学习,发布建议选择压缩版,便于用户极速体验(点击下载若出现的是代码页 面,Ctrl+A全选复制 ...

  3. MySQL 高可用架构 之 MHA (Centos 7.5 MySQL 5.7.18 MHA 0.58)

    目录 简介 环境准备 秘钥互信 安装基础依赖包 安装MHA组件 安装 MHA Node组件 安装 MHA Manager 组件 建立 MySQL 一主三从 初始化 MySQL 启动MySQL 并简单配 ...

  4. 重新调用 layoutSubview

    重新调用 layoutSubview

  5. block中self会造成循环引用问题

    将代码块中的 self换成unsafeSelf __unsafe_unretained 与 __weak 99%相同 __weak 当对象释放之后 会自动设置为nil 而__unsafe_unreta ...

  6. 2019-2020-9 20199317 《Linux内核原理与分析》第九周作业

    第8章  进程的切换和系统的一般执行过程 1  进程调度的时机 1.1  硬终端与软中断 进程调度的时机都与中断相关,中断有很多种,都是程序执行过程中的强制性转移,转移到操作系统内核相应的处理程序.中 ...

  7. C# 中的委托和事件(一)

    引言 委 托 和 事件在 .Net Framework中的应用非常广泛,然而,较好地理解委托和事件对很多接触C#时间不长的人来说并不容易.它们就像是一道槛儿,过了这个槛的人,觉得真 是太容易了,而没有 ...

  8. Thinkphp5——pathinfo的访问模式、路径访问模式

    tp5访问入口文件的时候是,访问public目录下的index.php,那么她真正访问的url到底是什么?如何去访问其他页面,实际上她默认使用的PATH_INFO模式进行访问. PATHINFO模式 ...

  9. Python开发GUI工具介绍,实战:将图片转化为素描画!【华为云技术分享】

    版权声明:本文为博主原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明. 本文链接:https://blog.csdn.net/devcloud/article/detai ...

  10. 【Python成长之路】从零学GUI -- 制作智能聊天机器人

    [写在前面] 鹏哥:最近老惹小燕同学不开心,结果都没人陪我聊天了.哎,好无聊呀! 肥宅男:女朋友什么的最无聊了,还没我的图灵机器人好玩. 鹏哥:图灵?好巧,和我部门同名. [效果如下] [实现过程] ...