JavaScript 插件生成二维码

之前做项目的时候用户需要二维码，本人小白一个就直接在网上找了代码，下面说一说遇到的问题。

首先在页面中加入jquery库文件和qrcode插件

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

然后在需要生成二维码的地方引入

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

最后是生成二维码的js代码

jQuery('#qrcode').qrcode({
			render : "canvas",
			width : 150,
			height : 150,
			text : utf16to8("www.baidu.com")
		});

附上utf8转换代码

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;
	}

比较坑的是，用户说加一个打印二维码的功能，本以为很简单，没想到打印网页上其他内容都好使，就是不能打印二维码，去网上各种查询打印的方法

<script type="text/javascript" src="../qrcode/jquery.jqprint-0.3.js"></script>

function printme() {
		var img = document.getElementById("image");
		var canvas = document.getElementsByTagName("canvas")[0];
		img.src = canvas.toDataURL();
		$("#image").jqprint({
			debug : false,
			importCSS : true,
			printContainer : true,
			operaSupport : false,
			callBack : function() {
				console.log("callBack");
			}
		});
	}

<div id="qrcode"></div>
	<label id="qrcodeInfo"></label>
	<img id="image" src="" />
	<input style="margin-left: 50px;" type="button" value="打印二维码"
		onclick="printme()" />

调用自带的框架里面的内容就可以了，这里有个小问题，框架本身没有callBack ，我为了能设置返回值在框架的源码里面加了一句，就可以了。

有需要源码的可以留言哦。