分享一个生成二维码的插件–QRCode.js_生成二维码 js插件-优快云博客

随着移动设备普及，二维码应用广泛。前端可通过QRCode.js快速生成二维码。文章介绍了引入插件、基本用法和API，如设置二维码内容的makeCode方法和清除二维码的clear方法，还附上了demo。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

这世间最烈的酒，是你低头噙笑的温柔。

随着移动设备的普及，日常生活中随处可见二维码，大有一码走天下之势。那么前端如何来生成二维码？

通过QRCode.js我们可以快速生成二维码啦，一起来看看怎么使用吧。

1、引入插件

    /*html*/
    <div id="qrcode"></div>

    /*js*/
    <script src="qrcode.js"></script>

2、基本用法

    var qrcode = document.getElementById('qrcode')

    /*直接生成二维码*/
    new QRCode(qrcode, 'http://www.daqianduan.com')

    /*也可以配置二维码的宽高等*/
    var qrcodeObj = new QRCode('qrcode', {
        text: 'http://www.daqianduan.com',
        width: 256,
        height: 256,
        colorDark : '#000000', //前景色
        colorLight : '#ffffff'  //背景色
    })

3、API

设置二维码内容–makeCode
qrcodeObj.makeCode(‘http://www.daqianduan.com/?p=6518&preview=true’)
清除二维码–clear
qrcodeObj.clear()
附上我的demo

   
function getwx(comboId, totalAmount, payChannel) {
   $.ajax({
       url: XXXXXXXX,
       data: {
           comboId: comboId,
           totalAmount: totalAmount,
           payChannel: payChannel,
       },
       beforeSend: function (xhr) {
           xhr.setRequestHeader("auth-token", localStorage.getItem('authToken'));
       },
       type: 'post',
       success: function(res) {
           if (res.code == 0) {
               qrcode.makeCode(res.data);
               $('.wxfullPage').show();
           }
       },
   })
};

var qrcode = new QRCode(document.getElementById("qrcode"), {
   width : 100,
   height : 100
});

差不多就是个这