w3ctech

使用jQuery.qrcode生成二维码

移动互联网时代的到来,二维码也经常用到,比如w3ctech的文章,如果你觉得好的话,就可以分享到朋友圈。但是如果你是在电脑上阅读的,但是又想在微信中分享,自己输入url又比较麻烦,所以采用扫二维码的方式就会便捷很多,哪今天我在这里向大家介绍一种使用JS的生成二维码的方式。

如果你的产品是使用的jQuery的话,哪么使用jQuery.qrcode就可以很方便的生成二维码。他可以生成canvas、div、image三种方式的二维码。

它的使用方式也非常简单,你只需要在github把代码下载后,并引入到页面中。

github地址:https://github.com/lrsjng/jquery-qrcode

最简单的用法就是:

$(selector).qrcode(url);

如果你希望定制你的二维码,可以像下面这样编写,options是一个json:

$(selector).qrcode(options);

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
}

官方文档地址:http://larsjung.de/jquery-qrcode/

w3ctech微信

扫码关注w3ctech微信公众号

共收到1条回复

  • 简约,实用

    回复此楼