新建一个包括了jquery和jquery.qrcode的页面
调用qrcode插件
$('#qrcode').qrcode("http://www.baidu.com")
//任意字符串
浏览器中时如下结果,默认情况下qrcode生成的是canvas图片,这样效率高
<!DOCTYPE html><html>
<head>
<meta charset="utf-8" />
<title></title>
<link href="css/bootstrap.css" rel="stylesheet" />
<script type='text/javascript' src='http://cdn.staticfile.org/jquery/2.1.1/jquery.min.js'></script>
<script type="text/javascript" src="http://cdn.staticfile.org/jquery.qrcode/1.0/jquery.qrcode.min.js"></script>
<style>
body {
font-size: 14px
}
#body div {
margin-top: 4rem
}
.clearfloat {
zoom: 1
}
#cover {
position: absolute
left: 0px
top: 0px
background: rgba(0, 0, 0, 0.8)
width: 100%/*宽度设置为100%,这样才能使隐藏背景层覆盖原页面*/
height: 100%
filter: alpha(opacity=100)/*设置透明度为60%*/
opacity: 1/*非IE浏览器下设置透明度为60%*/
display: none
z-Index: 999
}
</style>
</head>
<body>
<div id="qrcode"></div>
<script type="text/javascript">
var str = "hellow"
jQuery('#qrcode').qrcode({width: 64,height: 64,text: str})//这里可以设置大小~~
</script>
</body>
</html>