1、引入jquery.min.js和qrcode.js
2、声明创建二维码的容器的DIV
3、调用qrcode.js创建方法
<!DOCTYPE html>
<html>
<head>
<title>预览</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0, user-scalable=no">
<script src="../../js/jquery.min.js"></script>
<script src="../../js/qrcode.js"></script>
<style type="text/css">
body {
background: #fff;
margin: 0px;
padding: 0px;
}
h2{
text-align: center;
}
p{
font-size: 15px;
font-family: "微软雅黑";
}
</style>
</head>
<body>
<div id="qrcode" style="margin-left: 30px;"></div>
</body>
<script type="text/javascript">
var shareUrl='123456789';
var qrcode = new QRCode(document.getElementById("qrcode"), {
width : 100,
height : 100
});
function makeCode () {
qrcode.makeCode(shareUrl);
}
makeCode();
</script>
</html>
创建QRCode中可传构造参数:
width : 256, //宽度
height : 256,//高度
typeNumber : 4,//计算模式 ,一般不用
colorDark : “#000000”,//图点色
colorLight : “#ffffff”,//背景色
correctLevel : QRErrorCorrectLevel.H//错误级别[L|M|Q|H]
附件地址:
JQuery