前言
对qrcode的介绍有很多，今天接触了下生成二维码相关的一些方案。个人觉得js相关的实现可能使用范围更广泛。本文算是对今天学习的一个总结，也供以后个人参考使用。
所需的环境
1）jquery-1.9.1.min.js。
2）jquery.qrcode.min.js 压缩文件 或 （jquery.qrcode.js和qrcode.js源码文件）
3）utf16to8.js。因为qrcode默认不支持中文，所以需要将Unicode编码转为UTF-8编码，如果不涉及中文的，不用理会这个js文件。
测试源码
<!DOCTYPE html>
<html>
<head>
<title>二维码生成方案测试</title>
<script type="text/javascript" src="./jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="./jquery.qrcode.min.js"></script>
<script type="text/javascript" src="./utf16to8.js"></script>
</head>
<body>
<div align="center">
<input type="text" id="inputStr"><button id="btn">生成二维码</button><hr>
<div id="current" style="color:red;font-size:20px;"></div>
<div id="erWeiMa"></div>
</div>
<script type="text/javascript">
$("#btn").click(function(){
//清空二维码
$("#erWeiMa").empty();
$("#current").empty();
//输入内容验证
if($("#inputStr").val() == "")
{
alert("请输入要生成二维码的内容!");
return;
}
/**
* 参数列表
* render : "canvas",//设置渲染方式
width : 256, //设置宽度
height : 256, //设置高度
typeNumber : -1, //计算模式
correctLevel : QRErrorCorrectLevel.H,//纠错等级
background : "#ffffff",//背景颜色
foreground : "#000000" //前景颜色
*
*/
//生成二维码
$("#erWeiMa").qrcode({
render:"canvas", //table canvas
text:utf16to8($("#inputStr").val())
});
$("#current").append($("#inputStr").val());
$("#inputStr").val("");
});
</script>
</body>
</html>qrcode参数说明
参数列表
render : "canvas",//设置渲染方式
width : 256, //设置宽度
height : 256, //设置高度
typeNumber : -1, //计算模式
correctLevel : QRErrorCorrectLevel.H,//纠错等级
background : "#ffffff",//背景颜色
foreground : "#000000" //前景颜色 utf16to8.js
这个js文件主要是处理中文字符的，目的就是将Unicode编码的字符转为utf-8编码的字符。
//解决中文问题
function utf16to8(str) {
var out, i, len, c;
out = "";
len = str.length;
for(i = 0; i < len; i++) {
c = str.charCodeAt(i);
if ((c >= 0x0001) && (c <= 0x007F)) {
out += str.charAt(i);
} else if (c > 0x07FF) {
out += String.fromCharCode(0xE0 | ((c >> 12) & 0x0F));
out += String.fromCharCode(0x80 | ((c >> 6) & 0x3F));
out += String.fromCharCode(0x80 | ((c >> 0) & 0x3F));
} else {
out += String.fromCharCode(0xC0 | ((c >> 6) & 0x1F));
out += String.fromCharCode(0x80 | ((c >> 0) & 0x3F));
}
}
return out;
} 运行效果
