首页 > 代码库 > 使用jquery-qrcode生成二维码

使用jquery-qrcode生成二维码

二维码

java方面二维码相关工具大概有qrcode和zxing,

但是一般来说应用二维码比较多的是生成,扫描用的比较少,

而qrcode和zxing是两者都有,所以比较臃肿。


jquery-qrcode

官网:

说明:jquery的一个插件,jquery-qrcode可以利用js生成二维码,效果不错。这里做一下封装,让使用起来更简单。


引入

需要引入jquery和jquery-qrcode,这两个在static cdn上都有,直接引用就可以了,

另外还需要一段中文转码的js,一共需要引入:

        <!-- jquery-1.11.1 -->
        <script type="text/javascript" src=http://www.mamicode.com/"http://cdn.staticfile.org/jquery/1.11.1/jquery.min.js"></script>>


封装

封装是为了更好的使用,可以直接传str或者一个配置对象,具体如下:

/** 
 * 生成二维码
 * text:待生成文字
 * type:中文还是英文,cn为中文
 * render:展示方式,table为表格方式
 * width:宽度
 * height:高度
 * 注:需要引入<@jsfile ‘qrcode‘/>
 */
$.fn.qcode = function(options){
    if(options){
        var opt = {};
        if(typeof options == ‘string‘){
            opt.text = options;
        }else{
            if(options.text) opt.text = options.text;
            if(options.type && options.type == ‘ch‘) opt.text = qcodetochar(opt.text);
            if(options.render && options.render == ‘table‘) opt.render = options.render;
            if(options.width) opt.width = options.width;
            if(options.height) opt.height = options.height;
        }

        $(this).qrcode(opt);
    }
};


使用

1.页面需要一个div,并给一个id

2.$(‘#test‘).qcode({});


示例

简单非中文生成二维码:

$(‘#test‘).qcode(‘123‘);

自定义配置生成二维码:

$(‘#test‘).qcode({
    text : ‘你好‘,
    type : ‘cn‘,
    width : 100,
    height : 100
});


更多

更多文章请浏览:http://uikoo9.com/blog/list

使用jquery-qrcode生成二维码