本文主要介绍js生成二维码的样例代码，给大家看的很详细，对大家的学习或者工作都有一定的参考价值。有需要的朋友可以参考一下。
前段时间项目需要开发扫描二维码查看信息的功能。我在网上查了一些资料，总结了一下用过的方法。我需要导入一个二维码的js插件。
插件：qrcode.js下载地址，点击下载。
一、一个简单的示例
如下：(仅供参考)
% -
由IntelliJ IDEA创建。
用户：华硕
作者：xumz
日期：2021年2月27日
时间：10点33分
请注意处理。
要更改此模板，请使用文件|设置|文件模板。
- %
% @ page language=' Java ' content type=' text/html；charset=UTF-8 ' page encoding=' UTF-8 ' %
超文本标记语言
头
script charset=' utf-8 ' type=' text/JavaScript ' src=' js/jquery-1 . 11 . 0 . js '/script
script src=' js/QR code . min . js ' type=' text/JavaScript '/script
/头
身体
H1输入URL以生成二维码/h1
差异
='qr_link'URL的标签:/label
input id=' QR _ link ' type=' text ' value='您好马！'style=' width:460 px；'/
type=' button ' id=' QR _ create ' value=' generate '
p生成的二维码可以用手机任何扫描工具查看。/p
br/
/div
英国铁路公司
div id=' QR _ container ' style=' margin:auto；位置：相对；'/div
脚本类型='文本/javascript '
//点击生成按钮后
document . getelementbyid(' QR _ creat ')。onclick=function() {
varcode=new QR code(//实例化生成二维码
document . getelementbyid(' QR _ Container ')，{//存储二维码的div
宽度：160，//设置宽度和高度
身高：160，
}
);
//根据输入框的值生成二维码
qrcode.makeCode($('#qr_link ')。val())；
$('#qr_container ')。append(' brbr ')；//换行
}
/脚本
/body
/html
代码的运行效果如下：
二、二个简单的示例
第二个例子使用了layui的一些元素，layui下载地址。
简单介绍一下layui.all.js和layui.css
ScanQR.jsp如下：
% @ page language=' Java ' content type=' text/html；charset=UTF-8 ' page encoding=' UTF-8 ' %
！文档类型html
超文本标记语言
头
标题测试1/标题
%-注意引用和地址-%
script src=' js/QR code . min . js '/script
脚本src=' js/jquery-1 . 11 . 0 . js '/script
script type=' text/JavaScript ' src=' js/layui/layui . all . js '/script
link type=' text/CSS ' rel=' style sheet ' href=' js/layui/CSS/layui . CSS ' rel=' external no follow '/
/头
身体
div align='center '
按钮类型=' button' class='拉伊-BTN拉伊-BTN-普通拉伊-BTN-radius ' onclick=' skiphandle()'预览/按钮
/div
div id=' code ' style=' display:none；'
div id=' QR code ' style=' margin-left:75px；上边距：20px'/div
/div
脚本
layui.use(['layer']，function () {
var layer=layui.layer
});
//设置链接生成二维码
新二维码(document.getElementById('二维码')，{
' 3359blog.csdn.net/bug生产者/'，//注意地址修改。
宽度：250，
身高：250
});
//预览和其他弹出框
函数skipHandle() {
layer.open({
类型：1，
标题：“Bug _ Producer的博客”，//标题
面积：[' 400像素'，' 400像素']，
内容：$('#code ')。html()，
});
}
/脚本
/body
/html
操作效果如下：
这是博主刚刚生成的一个二维码。扫描后会跳转到博主主页。可以用手机浏览器或者微信QQ扫描…等等。关键代码是这句话：“https://blog.csdn.net/bug_producter/'
感兴趣的朋友可以去，
移动电话访问本地Tomcat服务器
本文最后还有二维码的内容，会加一个示例文件。
本文关于js生成二维码的示例代码到此为止。关于js生成二维码的更多信息，请搜索我们之前的文章或者继续浏览下面的相关文章。希望大家以后能多多支持我们！
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。