H5动态生成二维码(基于jQ与jquery.qrcode.js)


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

<script src="../../js/jquery-3.4.1.min.js"></script>

<script type="text/javascript" src="../../js/jquery.qrcode.min.js"></script>

<script type="text/javascript">

         // 生成二维码

    jQuery('#qrcode').qrcode({

        render: "canvas", //也可以替换为table

        width: 131,

        height: 131,

        text: shareUrl

    });

</script>


下载插件

指定生成二维码的大小:

可以在调用函数的同时输入想要生成二维码的宽度和高度即可指定生成的二维码的大小。

//生成100*100(宽度100,高度100)的二维码

jQuery('#qrcode').qrcode({

    render: "canvas", //也可以替换为table

    width: 100,

    height: 100,

    text: "http://www.jq22.com"

});


指定生成二维码的色彩样式:

可以在调用函数的同时输入想要生成二维码的前景色和背景色即可指定生成的二维码的色彩样式。

//生成前景色为红色背景色为白色的二维码

jQuery('#qrcode').qrcode({

    render: "canvas", //也可以替换为table

    foreground: "#C00",

    background: "#FFF",

    text: "http://www.jq22.com"

});


中文ULR生成方法:

jQuery("#output").qrcode(encodeURI("http://中文中文"));//使用encodeURI进行转码


最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。