您的位置是:网站首页>Javascript编程Javascript编程

javascript怎么实现二维码

少儿编程网2021-10-08 14:53:06Javascript编程 人已围观 来源:少儿编程 -用户投稿

简介javascript实现二维码的方法:1、下载qrcodejs插件;2、使用qrcode实现二维码生成,代码如“newQRCode(document.getElementById(qrcode)”。本文操作环境:windows7系统、javascript1.8.5版、Dell

javascript实现二维码的方法:1、下载qrcodejs插件;2、使用qrcode实现二维码生成,代码如“new QRCode(document.getElementById("qrcode")”。z0N少儿编程网-https://www.pxcodes.com

z0N少儿编程网-https://www.pxcodes.com

本文操作环境:windows7系统、javascript1.8.5版、Dell G3电脑。z0N少儿编程网-https://www.pxcodes.com

javascript怎么实现二维码?z0N少儿编程网-https://www.pxcodes.com

js实现二维码生成z0N少儿编程网-https://www.pxcodes.com

我们可以使用qrcodejs来实现js生成二维码,qrcodejs是用于JavaScript的跨浏览器QRCode生成器,可以十分简单的实现二维码生成z0N少儿编程网-https://www.pxcodes.com

一:下载qrcodejs插件z0N少儿编程网-https://www.pxcodes.com

qrcode的地址:https://github.com/davidshimj...z0N少儿编程网-https://www.pxcodes.com

下载下来的qrcode的文件如下,其中qrcode.js和qrcide.min.js就是我们所需要的js,qrcode.min.js是qrcode.js压缩版
z0N少儿编程网-https://www.pxcodes.com

二:实现二维码生成z0N少儿编程网-https://www.pxcodes.com

1:需要引入的jsz0N少儿编程网-https://www.pxcodes.com

qrcodejs旨在jquery的前提下实现的,所以我们先需要引入jquery在引入qrcodejsz0N少儿编程网-https://www.pxcodes.com

<script type="text/javascript" src="js/jquery.min.js"></script>     <!--引入jquery-->
<script type="text/javascript" src="js/qrcode.js"></script>         <!--引入qrcodejs-->

2:使用qrcode实现二维码生成z0N少儿编程网-https://www.pxcodes.com

<p id="qrcode" style="width:100px; height:100px; margin-top:15px;"></p>
<script type="text/javascript">
    new QRCode(document.getElementById("qrcode"), "https://wj0511.com");
</script>

这时候我们访问当前页我们就可以看到我们所生成的二维码了,扫码二维码后访问 https://www.wj0511.comz0N少儿编程网-https://www.pxcodes.com

这里来主要说明以下 new QRCode的一些基本参数z0N少儿编程网-https://www.pxcodes.com

上面我们生成的二维码可以跳转到指定的url,我们还可以设置二维码的一些基本参数,如下z0N少儿编程网-https://www.pxcodes.com

var qrcode = new QRCode(document.getElementById("qrcode"), {
text: "https://www.wj0511.com",//扫描二维码后的内容
width: 128,//二维码的宽
height: 128,//二维码的高
colorDark : "#000000",//二维码线条颜色
colorLight : "#ffffff",//二维码背景颜色
correctLevel : QRCode.CorrectLevel.H    //二维码等级
});

推荐学习:《javascript高级教程》

以上就是javascript怎么实现二维码的详细内容,更多请关注少儿编程网其它相关文章!z0N少儿编程网-https://www.pxcodes.com

来源:php中文网z0N少儿编程网-https://www.pxcodes.com


相关文章:

javascript怎么进行全局错误处理javascript中怎么将值转为字符串类javascript怎么设置cookie详解JavaScript扩展运算符的10种用javascript数组如何转为stringjavascript如何去除html标签

转载:感谢您对少儿编程网的认可,以及对我们原创作品以及精心收集文章的青睐,非常欢迎各位朋友分享到朋友圈,但转载请说明文章出处“来源少儿编程网”https://www.pxcodes.com/Codes/1633675987155410.html。

支持一下 ( )

上一篇:跨react域问题怎么解决

下一篇:JavaScript返回值是什么

Tags:qrcode javascript

少儿编程网最新发布

javascript怎么实现二维码

本栏点击

javascript怎么实现二维码Javascript编程

少儿编程网本站点击

javascript怎么实现二维码Javascript编程

少儿编程网最新开班

少儿编程网标签云

微信公众号

免费视频教程

先知道