1. 引用方式：
<script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script><script src="http://apps.bdimg.com/libs/jquery-qrcode/1.0.0/jquery.qrcode.min.js"></script>
2. 使用方式：
<!DOCTYPE html><html> ???<head> ???????<meta charset="UTF-8"> ???????<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1,user-scalable=no"> ???????<meta name="format-detection" content="telephone=no"> ???????<script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script> ???????<script src="http://apps.bdimg.com/libs/jquery-qrcode/1.0.0/jquery.qrcode.min.js"></script> ???????<title></title> ???</head> ???<body> ???????<div id="qrcode"></div> ???????<script type="text/javascript"> ???????????$(‘#qrcode‘).qrcode({ ???????????????render: "canvas", ????//默认配置，可以为空也可以替换为table ???????????????width: "250", ???????//设置宽度 ???????????????height: "250", ?????//设置高度 ???????????????foreground: "#C00", ???//二维码颜色 ????????????????background: "#FFF", ???//背景色 ???????????????text: ‘https://www.cnblogs.com/xyyt‘, //二维码内容 ???????????????????????}); ???????</script> ???</body></html>3. 微信中识别二维码——转换为图片格式：
<!DOCTYPE html><html> ???<head> ???????<meta charset="UTF-8"> ???????<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1,user-scalable=no"> ???????<meta name="format-detection" content="telephone=no"> ???????<script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script> ???????<script src="http://apps.bdimg.com/libs/jquery-qrcode/1.0.0/jquery.qrcode.min.js"></script> ???????<title></title> ???</head> ???<body> ???????<div id="qrcode"></div> ???????<img id="qrcodeImg"/> ???????<script type="text/javascript"> ???????????var qrcode = $(‘#qrcode‘).qrcode({ ???????????????render: "canvas", ????//默认配置，可以为空也可以替换为table ???????????????width: "250", ???????//设置宽度 ???????????????height: "250", ?????//设置高度 ???????????????foreground: "#C00", ???//二维码颜色 ????????????????background: "#FFF", ???//背景色 ???????????????text: ‘https://www.cnblogs.com/xyyt‘, //二维码内容 ???????????????????????}).hide(); ???????????//将生成的二维码转换成图片格式 ???????????var canvas = qrcode.find(‘canvas‘).get(0); ???????????$(‘#qrcodeImg‘).attr(‘src‘, canvas.toDataURL(‘image/jpg‘)); ???????</script> ???</body></html>4. 生成中文：
???????<div id="chinese_qrcode"></div> ???????<script> ???????????$(function() { ???????????????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; ???????????????} ???????????????jQuery("#chinese_qrcode").qrcode(utf16to8("中文中文")); //使用encodeURI进行转码 ???????????}) ???????</script>jquery-qrcode生成二维码
原文地址：https://www.cnblogs.com/xyyt/p/9408991.html