0jquery.qrcode简介

Jquery。Qrcode.js是浏览器端基于Jquery动态生成二维码的插件，支持Canvas和Table渲染模式。它的优点是在客户端动态生成，减少了服务器端的压力，尤其是在使用大量二维码的系统中。Jquery。二维码主要包括以下参数设置：

渲染定义二维码的渲染模式，包括表格和画布

宽度定义二维码的宽度

高度定义二维码的高度

文本定义二维码的内容

默认情况下，类型号二维码的计算模式一般为-1

纠错级别纠正级别二维码

背景定义二维码的背景颜色

前景定义二维码的前景色

1 Jquery。基本上使用二维码

1.0添加相关参考

Jquery。二维码只依赖于Jquery，所以我们只需要添加对Jquery和jquery.qrcode的引用。

script src=' http 3360 ~/content/js/jquery-2 . 1 . 4 . min . js '/script script src=' http 3360 ~/content/js/jquery . QR code . min . js '/script 1.1添加渲染区域元素

Jquery。二维码使用div元素作为渲染的目标区域，并在页面中添加一个div标签。

Div id='qrCodeDiv'/div1.2二维码生成

$ ('# qrcode div ')。二维码({render:' canvas '，//呈现方式为表格模式(IE兼容)和画布模式width: 260，//width height: 260，//height text : ' www . Baidu.com '，//Content typeNumber: -1，//计算模式修正级别： 2，//二维码纠错级别Background 3360' # ffffff '，//背景色Foreground 3360 ' # 000000 '/)二维码的生成如下

2 Jquery。二维码支持汉字

默认的Jquery。二维码不支持中文编码。如果将文本内容设置为中文字符串，生成二维码扫描后会发现结果乱码。这是因为jquery.qrcode采用charCodeAt()进行编码转换，默认采用UTF-8，而中文一般采用UTF-16编码，会导致代码乱码。解决方法是在二维码编码前，将二维码的内容串转换成UTF-8格式。js转换方法如下。

函数utf16to8(str) {var out，I，len，c；out=len=str.lengthfor(I=0；我透镜；I){ c=str . charcodeat(I)；if((c=0x 0001)(c=0x 007f)){ out=str . charat(I)；} else if(c0x07FF){ out=String . FromCharCode(0xe 0 |((c 12)0x0F))；out=String . FromCharCode(0x 80 |((c 6)0x3F))；out=String . FromCharCode(0x 80 |((c 0)0x3F))；} else { out=String . FromCharCode(0xc 0 |((c 6)0x1F))；out=String . FromCharCode(0x 80 |((c 0)0x3F))；} }返回；};生成二维码时，将转码结果作为文本的值

$ ('# qrcode div ')。二维码({render:' canvas '，//呈现方式为表格模式(IE兼容)和画布模式width: 260，//width height: 260，//height text: utf16to8('汉字内容的二维码')，//内容类型Number: -1，//计算模式修正级别： 2，//二维码纠错级别Background 3360' # ffffff '，//背景颜色Foreground 3360通过3jquery .二维码添加自定义Logo图片

在二维码中添加自定义徽标将使您的二维码看起来更加专业。默认的Jquery。二维码不支持添加自定义标志。这里简单的实现方案是为每个二维码添加一个img标签，让img在二维码区域相对集中显示。

img id=' qrcode ico ' src=' http : ~/images/logo . png ' style=' position : absolute；宽度： 30px；' height: 30px'/控制img标签的位置

var margin=($('#qrCodeDiv ')。height() - $('#qrCodeIco ')。高度())/2；//控制Logo图标$ ('# qrcodeico ')的位置。CSS('边距'，边距)；最终结果如下

下载Jquery。二维码

以上是边肖使用jQuery的介绍。二维码插件动态生成二维码并在客户端添加自定义Logo，希望对大家有所帮助。如果你有任何问题，请给我留言，边肖会及时回复你。非常感谢您对我们网站的支持！