<html>
<head>
<title></title>
<meta charset="utf-8"/>
<script src="js/qrcode.js"></script>
<style>
#qrcode{
/*text-align: center*/
/*display: table-cell*/
/*width: 96px*/
/*height: 96px*/
/*vertical-align:middle*/
/*position: relative*/
}
</style>
</head>
<body>
<div id="qrcode">
</div>
<input type="text" id="getval"/><button id="send">点击更换验证码</button>
<script>
window.onload =function(){
var qrcode = new QRCode(document.getElementById("qrcode"), {
width : 96,//设置宽高
height : 96
})
qrcode.makeCode("http://www.baidu.com")
document.getElementById("send").onclick =function(){
qrcode.makeCode(document.getElementById("getval").value)
}
}
</script>
</body>
</html>
网上找的应该有用 以后多度娘
如果是一个固定的二维码,我们只需要在网上找个地方生成图片,然后放上图片就可以了。但如果是地址不固定需要根据页面来生成的话。就有两种做法,一个是后端根据页面做一个动态的二维码。一种是前端使用插件生成。
本文要推荐的是一个jQuery二维码插件,它可以根据你设定的地址来生成一个二维码,二维码可以有div格式的,也有Canvas格式的,canvas的支持自定义logo和文字在上面。
jquery.qrcode.js 是把它用jquery 方式封装起来的,用它来实现图形渲染,其实就是画图支持canvas 和table 两种方式
支持的功能主要有:
1.text : "https://github.com/jeromeetienne/jquery-qrcode" //设置二维码内容 render,canvas
2.width :256, //设置宽度
3.height : 256, //设置高度
4. typeNumber : -1, //计算模式
5.correctLevel : QRErrorCorrectLevel.H,//纠错等级
6.background : "#ffffff", //背景颜色
7.oreground : "#000000" //前景颜色