功能简介

通过qrcode.js生成二维码的简单实现功能，代码很简单，需要在html引入jquery.min.js和qrcode.min.js
demo下载地址

代码实现

html

<!DOCTYPE html>
<html><head><meta charset="UTF-8"></head><script type="text/javascript" src="./qrcode/jquery.min.js"></script><script type="text/javascript" src="./qrcode/qrcode.min.js"></script><script src="./qrcode/setQrcode.js"></script><body><input type="text" id="qrcode-input" value="www.baidu.com"/><button onClick="makeCode()">测试按钮</button><div id="qrcode"></div></body><script>makeCode()</script>
</html>

js

function makeCode() {// 需要生成二维码的字符串（可以为链接，可以为普通字符串，可以从外面传入）var key = document.getElementById('qrcode-input').value// 需要获取一个div实例，用于存放二维码var div = document.getElementById('qrcode')// 控制二维码的宽高(可拆分)var qrcodeSize = 300// 将这个div清空，防止重复生成div.innerHTML = ''var qrcode = new QRCode(div, {width: qrcodeSize,height: qrcodeSize});qrcode.makeCode(key);
}

效果图

效果图由于带有二维码无法展示，可以通过demo直接进行查看

【功能实现】qrcode生成二维码Demo相关推荐

ThinkPHP框架整合phpqrcode生成二维码DEMO
ThinkPHP框架发展到今天功能已经变得是非常强大了,但是ThinkPHP框架中没有二维码相关的库,因此我们可以通过整合phpqrcode来完成生成二维码的功能.想使用phpqrcode首先就要把p ...
C# 利用QRCode生成二维码图片
网上生成二维码的组件是真多,可是真正好用的,并且生成速度很快的没几个,QRCode就是我在众多中找到的,它的生成速度快.但是网上关于它的使用说明,真的太少了,大都是千篇一律的复制粘贴.这是本要用它做了 ...
qrcode 生成二维码，带logo 带文字描述
qrcode 生成二维码 1.引入 pom.xml 2. ResourceRenderer 3. QRCodeUtil 4. QRCodeController 5. HTML 6. 测试 1.引入 p ...
使用jQuery的插件qrcode生成二维码（静态+动态生成）及常见问题解决方法
使用jQuery的插件qrcode生成二维码(静态+动态生成)及常见问题解决方法参考文章: (1)使用jQuery的插件qrcode生成二维码(静态+动态生成)及常见问题解决方法 (2)https: ...
关于QRCode生成二维码（背景图、Logo）
关于QRCode生成二维码的代码 /// <summary> /// 创建二维码 /// </summary> /// <param name="QRStrin ...
php使用Qrcode生成二维码
php使用Qrcode生成二维码首先检查php.ini Gd 库要打开 use QrCode; //控制器引用public function index(){include 'phpqrcode.p ...
用ThoughtWorks.QRCode生成二维码时出现“索引超出了数组界限”的错误
用ThoughtWorks.QRCode生成二维码时出现"索引超出了数组界限"的错误字符串较长的情况下,用ThoughtWorks.QRCode生成二维码时出现"索引超 ...
C语言使用QRcode生成二维码
C语言使用QRcode生成二维码的简单操作首先需要QRcode源码包可以参考这位大神的文章: https://blog.csdn.net/qq_21475601/article/details/7 ...
qr-code 生成二维码
1.下载: composer require endroid/qr-code php: >=7.2 2.新建Qrcodes.php二维码生成类 use Endroid\QrCode\ErrorC ...

【功能实现】qrcode生成二维码Demo

【功能实现】qrcode生成二维Demo

功能简介

代码实现

html

js

效果图

【功能实现】qrcode生成二维码Demo相关推荐

最新文章

热门文章