jquery.qrcode.min.js 是一款基于 jquery 方便生成二维码图片的小插件。该插件兼容主流浏览器:IE9~11, Chrome, Firefox, Safari, Opera, Mobile Safari, Android, Windows Mobile。最近刚好使用到它,简单学习了下如何使用,这里简单记录一下,以便备查。
和所有 js 文件一样,在使用之前我们需要先引入它,引入代码如下,请自行确保已经引入 jquery.min.js 文件。
<script type="text/javascript" src="jquery.qrcode.min.js"></script>
然后是一些具体的操作方法。
基础使用
一般情况下我们只需要创建一个 DOM 元素,然后将需要生成二维码的参数通过 js 代码传入进去生成即可:
创建 DOM 元素
<div id="qrcode"></div>
JS 生成二维码
<script> jQuery(document).ready(function(){ $('#qrcode').qrcode("https://blog.quietguoguo.com/"); }); </script>
注意:需要生成中文字符的二维码需要使用 encodeURI 对输入的文本参数进行转码。
高级操作
如果需要自定义调整二维码的生成方式,大小,颜色等信息可参考如下设置:
<script> jQuery(document).ready(function(){ $('#qrcode').qrcode({ render:"canvas", // 可切换为 table,默认 canvas width: 100, // 宽度,单位 px height: 100, // 高度,单位 px foreground: "#f00", // 前景色 background: "#fff", // 背景色 correctLevel: 0, // 纠错等级 0 1 2 3 text: "https://blog.quietguoguo.com/" // 需要生产二维码的文本内容 }); }); </script>