js动态生成二维码

html:

<script type="text/javascript" src="js/qrcode.min.js"></script>(资源里可下载)

<div class="tan_ma" style="width:100%; height:100%; position:fixed; left:0; top:0; background:rgba(0,0,0,0.5); display:none; justify-content: center; align-items: center;">

<div style="width:50%; background:#fff; padding:20px">

<div class="tan_close_ma" style="font-size:30px; margin-bottom:7px; float:right; position:relative; right:-5px; top:-5px">X</div>

<div id="code" style="clear:both;display:flex; justify-content: center; "></div>

</div>

</div>

$(document).on("click", ".fangda", function () {

var zhi=$(this).attr("zhi");

$("#code").html('');

$(".tan_ma").css("display","flex");

console.log('放大'+zhi);

var qrcode = new QRCode(document.getElementById("code"), {

width : 201,

height : 201

})

qrcode.makeCode(zhi)

})

$(document).on("click", ".tan_close_ma", function () {

$(".tan_ma").hide();

})

相关推荐
开心工作室_kaic26 分钟前
ssm161基于web的资源共享平台的共享与开发+jsp(论文+源码)_kaic
java·开发语言·前端
刚刚好ā26 分钟前
js作用域超全介绍--全局作用域、局部作用、块级作用域
前端·javascript·vue.js·vue
沉默璇年2 小时前
react中useMemo的使用场景
前端·react.js·前端框架
yqcoder2 小时前
reactflow 中 useNodesState 模块作用
开发语言·前端·javascript
2401_882727572 小时前
BY组态-低代码web可视化组件
前端·后端·物联网·低代码·数学建模·前端框架
SoaringHeart2 小时前
Flutter进阶:基于 MLKit 的 OCR 文字识别
前端·flutter
会发光的猪。3 小时前
css使用弹性盒,让每个子元素平均等分父元素的4/1大小
前端·javascript·vue.js
天下代码客3 小时前
【vue】vue中.sync修饰符如何使用--详细代码对比
前端·javascript·vue.js
猫爪笔记3 小时前
前端:HTML (学习笔记)【1】
前端·笔记·学习·html
前端李易安3 小时前
Webpack 热更新(HMR)详解:原理与实现
前端·webpack·node.js