jquery.qrcode.js 是一个纯浏览器 生成 QRcode 的 jQuery 插件,它使用非常简单,生成的 QRcode 无需下载图片,并且不依赖第三方服务,比如最近 Google 服务在国内访问不稳就造成我好几个网站的 QRcode 不能使用,并且压缩之后大小小于 4K。
jquery.qrcode.js 使用
1. 加载 jQuery 和 jquery.qrcode.js:
<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>
2. 创建一个用于包含 QRcode 图片的 DOM 元素,比如 div:
<div id="qrcode"></div>
3. 然后通过下面代码生成 QRcode:
jQuery('#qrcode').qrcode("http://blog.wpjam.com");
4. 默认生成的二维码大小是 256×256,当然可以自定义大小:
jQuery('#qrcode').qrcode({width: 64,height: 64,text: "http://blog.wpjam.com"});
原文:http://blog.wpjam.com/m/jquery-qrcode/
github地址:https://github.com/lrsjng/jquery-qrcode
官方文档地址:http://larsjung.de/jquery-qrcode/
下载附件:jquery-qrcode-master
options可定制render的方式,大小,颜色等信息:
{ // render 方式: 'canvas', 'image' or 'div' render: 'canvas', // version range somewhere in 1 .. 40 minVersion: 1, maxVersion: 40, // error correction level: 'L', 'M', 'Q' or 'H' ecLevel: 'L', // offset in pixel if drawn onto existing canvas left: 0, top: 0, // size in pixel size: 200, // code color or image element fill: '#000', // background color or image element, null for transparent background background: null, // content text: 'no text', // corner radius relative to module width: 0.0 .. 0.5 radius: 0, // quiet zone in modules quiet: 0, // modes // 0: normal // 1: label strip // 2: label box // 3: image strip // 4: image box mode: 0, mSize: 0.1, mPosX: 0.5, mPosY: 0.5, label: 'no label', fontname: 'sans', fontcolor: '#000', image: null }
识别中文
我们试验的时候发现不能识别中文内容的二维码,通过查找多方资料了解 到,jquery-qrcode是采用charCodeAt()方式进行编码转 换的。而这个方法默认会获取它的Unicode编码,如果有中文内容,在生成二维码前就要把字符串转换成UTF-8,然后再生成二维码。您可以通过以下函 数来转换中文字符串:
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; }
以下示例:
var str = toUtf8("钓鱼岛是中国的!"); $('#code').qrcode(str);
相关推荐
基于jquery二维码生成插件jquery.qrcode.js在线生成二维码
最近项目中需要开发生成二维码的功能,方便使用手机使用,经测试可以使用的。
jquery.qrcode.min.js 二维码的jquery插件
前端生产二维码的js,测试过了能用,$('#qrcode').html('').qrcode({ text: "生成二维码的字符串"});
所以,针对微信小程序的特点,封装了 weapp.qrcode.js ,用于在小程序中快速生成二维码 使用方法见下面链接 --------------------- https://blog.csdn.net/qq_41981057/article/details/84632553
jquery-qrcode的源码 jquery.qrcode.min.js 用于生成二维码
jquery.qrcode.js生成二维码插件&转成图片格式 ;"> ;"><img id='imgOne'/></div> var qrcode =$('#code').qrcode({ render : "canvas", //设置渲染方式,有table和canvas,使用canvas方式渲染性能相对来说比较...
jquery.qrcode.min.js 是用于生成二维码的,这里包括了二维码生成的qrcode,也有基础的使用办法
【解压后放在web目录】jquery.qrcode.min.js H5 html jsp生成二维码官方js库
所以,针对微信小程序的特点,封装了 weapp.qrcode.js ,用于在小程序中快速生成二维码。效果如下图: (此图片来源于网络,如有侵权,请联系删除! ) 下面来介绍一下使用方法: 使用 创建canvas标签 先在 wxml 文件...
qrcode包就是一个可以将字符串画出二维码的jquery包,这个里面包含了jquery1.8.3和qrcode以及jquery_qrcode包,在用的时候按照上面的顺序依次加载就可以了。调用方法qrcode()
qrcode 二维码生成插件
使用jquery.qrcode生成二维码(支持中文) 原理:如果浏览器支持canvas,则使用canvas绘制二维码,否则使用table绘制,但是canvas效率比table高。 适用浏览器:IE8、360、FireFox、Chrome、Safari、Opera、傲游、搜狗...
二维码插件jquery.qrcode.js
官网下载的qrcode.js不支持在二维码中携带logo,也不支持中文 jquery.qrcode.js可以
插件描述:Jquery 二维码生成插件,高度定制. 参考示例:http://www.jq22.com/jquery-info4094
html5+jquery.qrcode前端生成二维码海报 废话不多说直接上代码 需要使用的JS插件 <script src="js/jquery-2.1.1.min.js"> <script src="js/jquery.qrcode.min.js"></script>
jquery.qrcode.min.js插件生成二维码demo
这个是改过的jquery.qrcode.js,添加了中间生成Logo的功能, $('#code').qrcode({ text : "hello world", //扫描二维码后显示的内容,可以直接填一个网址,扫描二维码后自动跳向该链接 width : "200", // //二维码...
使用jquery 的jquery.qrcode.js,在html中写的一个小demo