如何用 几个js插件,在html 页面生成自己的二维码
学习目标：
学会生成属于自己的二维码
准备工作：
插件工具
实现生成二维码，需要几个插件 jquery2.1.4.js、jquery.qrcode.js 和汉化包插件 utf.js
下载 jquery2.1.4.js、jquery.qrcode.js 这两个包 需要汉化的话再加上一个 utf.js
地址在这里 链接：https://pan.baidu.com/s/16k2Z0XEoAYMtLylxaZ7ruQ 提取码：is42
语言
html 、jQuery
截图展示：
<hr style=" border:solid; width:100px; height:1px;" color=#000000 size=1">
源码：
下面是个人写的源码，内容比较简单，看源码应该就没问题了
<html lang="en">
<head>
<meta charset="UTF-8">
<title>二维码生成</title>
<script src="js/jquery2.1.4.js"></script>
<script src="js/jquery.qrcode.js"></script>
<!-- 有上面两个 js文件，就足够生成二维码， 下面这是汉化包js -->
<script src="js/utf.js"></script>
</head>
<body>
<div id="qrcode"></div>
<script>
<!-- 二维码信息的设置 -->
var config ={
width:200,
height:200,
text:这是一个二维码, //text就表示二维码中存储的数据 必须传递
correctLevel: 1, // 取值为0|1|2|3 表示二维码的纠错级别0:L/1:M/2:Q/3:H ,默认0 可选参数
background:"#FFFFFF",//默认白色, 表示二维码的后景颜色 可选参数
foreground:"#000000",//默认黑色, 表示二维码的前景颜色 可选参数
};
// jq 找到id 为qrcode的 div，执行 二维码生成
$("#qrcode").qrcode(config);
</script>
</body>
</html>
补充 步骤
步骤:
1. 引入Jquery.js文件
2. 引入jquery.qrcode.js文件
3. 引入支持中文的编码js文件 (utf.js)
4. 在网页中编写一个div 用于显示二维码
<div id="div1"></div>
5. 准备二维码的规格对象(JSON)
var config = {
width:数字,//值是number类型, 表示的单位是px 必须传递
height:数字,//值是number类型, 表示的单位是px 必须传递
text:"内容",//text就表示二维码中存储的数据 必须传递
correctLevel:数字,//取值为0|1|2|3 表示二维码的纠错级别0:L/1:M/2:Q/3:H ,默认0 可选参数
background:"#rrggbb",//默认白色, 表示二维码的后景颜色 可选参数
foreground:"#rrggbb",//默认黑色, 表示二维码的前景颜色 可选参数
render:"绘制模式"//取值:table/canvas , 默认table 可选参数
};
6. 通过选择器, 查找到上述的div ,得到Jquery对象, 通过jquery对象的qrcode函数生成二维码
$("#div1").qrcode(config);
