jquery生成二维码

<div class="code-container">
<div class="code" >
<div class="mycode">
<div id="code"></div>
</div>
</div>
<div id="imagQrDiv"></div>//canvas转化为img后的存放容器，要覆盖在生成的code上面，或者将生成的img放到class='code'里面
</div>

.code-container{
position:absolute;
width:100%;
height:100%;
z-index:10;
margin-top:-8px;
margin-left:-8px;
}
.code{
width:138px;
height:138px;

position:absolute;
left:50%;
top:50%;
transform:translateX(-50%);
-webkit-transform: translateX(-50%) ;
box-sizing: border-box;
border:4px solid #fff;

}

.mycode{
width:100%;
height:100%;
}

#imagQrDiv{
width:100%;
height:100%;

position:absolute;

box-sizing: border-box;
z-index:99999;
}

require ('./../../../static/js/jquery.min.js');
require ('../../../static/js/jquery.qrcode.min.js');
qrcode();
function qrcode () {
$("#code").qrcode({
text: this.codeUrl,
width:130,
height:130
});

function convertCanvasToImage(canvas) {

var image = new Image();

image.src = canvas.toDataURL("image/png");
return image;
}

var mycanvas1=document.getElementsByTagName('canvas')[0];

var img=convertCanvasToImage(mycanvas1);

$(img).css({'width':'138px','height':'138px','position':'absolute','top':'50%','left':'50%','transform':'translateX(-50%)','boxSizing':'border-box','border':'4px solid #fff'});
$('#imagQrDiv').append(img);
}