沐风の秘密基地
青春とは、七つの自分に会えること。
沐风の秘密基地

使用jquery.qrcode.js在页面生成二维码

引入

新建一个html文件,添加以下代码

<script src="js/jquery.js"></script>
<script src="js/jquery.qrcode.js"></script>

创建容器

<div id="qrcode"></div>

生成二维码

编写js,通过js来为div加载不同的二维码。

$("#qrcode").qrcode({
    render: "canvas",//渲染方式,只是canvas、table
    text: "Hello  Word",//二维码的内容
    width: "140",//二维码宽度
    height: "140",//二维码高度
    background: "#ffffff",//二维码背景色
    foreground: "#005b7e"//二维码前景色
});

此处的render使用的是canvas方式,还有一种是table方式,这两者主要区别:canvas是生成的实际是一张图片,而table方式生成的则是由html的<table>标签通过控制细密的单元格背景色的黑白来组成的二维码,一个点就是一个单元格。canvas方式生成的可直接以图片格式保存,而table的不能。canvas的容易放大失真,table的不易失真。

预览

保存html文件,打开浏览器访问,即可看到二维码成功生成辣!

赞赏
# # #
首页      学习日记      使用jquery.qrcode.js在页面生成二维码

Mufeng

文章作者

发表评论

textsms
account_circle
email

沐风の秘密基地

使用jquery.qrcode.js在页面生成二维码
引入 新建一个html文件,添加以下代码 <script src="js/jquery.js"></script> <script src="js/jquery.qrcode.js"></script> 创建容器 <div id="qrcode"…
扫描二维码继续阅读
2021-01-09