JS实现二维码生成
绪
项目开发原语:已然花费半天的时间,仍旧未能将二维码显示在订单中。但是可以在单个页面中显示二维码,结合到angularjs的控制器中就失效了,自己是真的找不到其中的原因了。费解!刚开始怀疑是遮挡的问题,结果将位置更改之后还是不能显示。
那么自己就得转换解题思路了,将二维码显示单独置于一个页面中,然后通过页面的嵌套(有关文章见博文"如何将一个html页面嵌套在另一个页面中"),将二维码再显示到订单中。
正题
二维码生成借用第三方的js库,主要代码如下:
<body>
<div style="margin-top: 70px; margin-left: 800px;">
<div id="qrcode" alt="二维码图片"></div>
<input type="text" id="getval" style="margin-top: 70px;"/>
<button id="send" ng-click="doQrcode()">点击更换二维码</button>
</div>
<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>