canvas生成二维码(2)

不同的插件实现相同的效果,用起来更简洁一些,引用插件qrcode.js

创建一个新的QRCode对象,利用动漫节点和data数据进行复制,实现生成图片img的二维码:

详细见下方代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta charset="utf-8">
<title>银企通扫码收银台</title>
<style type="text/css">
.demo {
width: 400px;
margin: 40px auto 0 auto;
min-height: 250px;
}

.demo p {
line-height: 30px
}

#code {
margin-top: 10px
}
</style>
<script type="text/javascript" src="jquery-1.8.1.js"></script>
<script type="text/javascript" src="qrcode.js"></script>
<body>
<div id="main">
<div class="demo">
<div id="qrcode"></div>
</div>
<input type="hidden" id="data" value="11gcghchchgugugyugukguyghhghjghbbvbvbnw">
</div>
</body>
<script type="text/javascript">
var data = $("#data").val();
new QRCode(document.getElementById("qrcode"), data);
// 设置要生成二维码的链接
</script>
</html>

转载于:https://www.cnblogs.com/wyliunan/p/8145947.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/467001.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

UART/I2C/SPI/1-wire四大通信接口的神解释

1、 裘千丈轻功水上漂之UART射雕英雄传中的裘千丈说&#xff0c;UART就是我的轻功水上漂过河。想从河上过&#xff08;通信&#xff09;&#xff0c;提前布暗桩&#xff0c;行走时步伐按桩距固定&#xff08;波特率提前确定&#xff09;&#xff0c;步幅太大或太小都会落水。为…

动漫迷看的一点动漫

个人看过的动漫 (注&#xff1a;排名不分先后) 宗旨&#xff1a;技术的学习是有限的&#xff0c;分享的精神是无限的。 1、魔法科高中的劣等生&#xff1a;国立魔法大学附属第一高校——通称“魔法科高校”&#xff0c;是由成绩优秀的“一科生”&#xff0c;和作为一科生替补的…

last_kmsg和ram console

相关文章Android 7.1使用脚本保存LOGCAT和KMSG日志到文件首先&#xff0c;在kernel里面通过printk吐log的时候会是下面的一个过程&#xff1a;printk会将信息格式化到kernel log buffer里面去。然后将这些格式化信息送到console去&#xff0c;在我们的系统里面有两个console&am…

字符串类

1.String类 常用方法&#xff1a; 参考&#xff1a;http://wenku.baidu.com/link?urltz-3Dpwj-JSJQdG6vSo0J1L1G9oJS4eQJjYgogieIzgjdNNLmj-U9EpWhOnVthz4egAKv0SNmLkqzNz2WsiZ2EmPGMu2UXhB6yy-E4yvMQ3 NB&#xff1a; 这里的”s1s2“是地址相等,而是s1.equals(s2)是内容相等…

github网页

GitHub主页创建仓库想必大家都有自己的Github账号吧&#xff0c;没有的可以到GitHub官网注册账号&#xff0c;注册完后&#xff0c;我们来下一步&#xff0c;在我们的GitHub上面右上角的New repository来创建一个仓库。 仓库名必须遵守相应格式&#xff1a;your_username.githu…

企业应该如何选型ERP?

企业应该如何选型ERP呢?!其实说起这个话题, 是源于我们公司所在的镇里,镇长带着两个企业的企业家,到我们公司指名让我给他们讲讲. 俗称:取经我是乐意的,因为做了这么久的顾问了,感觉不像是顾问了,倒成了传教士了. 总喜欢说上两句.然后把自已的观点或看法,希望传给别人,然后影…

有用的Copy-On-write,写时复制

写时复制和写时拷贝是一个意思写时复制是一种策略&#xff0c;并不是Linux独有的&#xff0c;如果你正在设计某个系统架构&#xff0c;也可以参考这种思想。写时复制的英文解释如下Copy-on-write (sometimes referred to as "COW") is an optimization strategy used…

lambda应用

def test(a, b, func):result func(a, b)print(result)test(10, 15, lambda x, y: x y) #codingutf-8 #python2需要加上codingutf-8def test(a, b, func):result func(a, b)return result #python2中的方式 #func_new input("请输入一个匿名函数:")#python3中的方…

51单片机学习

单片机学习 宗旨&#xff1a;技术的学习是有限的&#xff0c;分享的精神是无限的。 学习使用单片机就是理解单片机硬件结构&#xff0c;在汇编或C语言中学会各种功能的初始化设置&#xff0c;以及实现各种功能的程序编制。 第一步&#xff1a;数字I/O的使用 使用按钮输入信…

数据库操作,内外联查询,分组查询,嵌套查询,交叉查询,多表查询,语句小结...

为了大家更容易理解我举出的SQL语句&#xff0c;本文假定已经建立了一个学生成绩管理数据库&#xff0c;全文均以学生成绩的管理为例来描述。 1.在查询结果中显示列名&#xff1a; a.用as关键字&#xff1a;select name as 姓名 from students order by age b.直接表示&#x…

雷军:如果程序人生的话,这条路太漫长

这篇文章是在雷总个人博客看到的&#xff0c;里面聊到了他作为程序员的一些经历、初衷以及思考。写的不错&#xff0c;便转来给大家看看。-- 如果程序人生的话&#xff0c;这条路太漫长我并非天生喜欢写程序&#xff0c;上高中时也没有想过程序员的生活。我学电脑非常偶然&…

跨年操作--new Date()

//时间在2017/12/31 17&#xff1a;00 --- 2018/1/1 06:00区间&#xff0c;提示用户无法操作公告。 //time.js (function(){ var date new Date(); //当前年份 var year date.getFullYear(); //当前月份 var month date.getMonth()1; //当前日 var day date.getDate(); //当…

List接口

List接口是collection接口的子接口&#xff0c;对collection进行了简单的扩充&#xff0c;添加了利用索引&#xff08;“位置序”&#xff09;作为参数或者返回类型的方法。List中存放的对象都有一个整数型的型号&#xff0c;记录该对象在容器中的位置&#xff0c;可以根据序号…

51单片机——硬件基础

单片机——硬件基础知识 宗旨&#xff1a;技术的学习是有限的&#xff0c;分享的精神是无限的。 1、单片机内部资源 STC89C52&#xff1a;8KFLASH、512字节RAM、32个IO口、3个定时器、1个UART、8个中断源 &#xff08;1&#xff09;Flash&#xff08;硬盘&#xff09;——程…

线程静态的几个特点

很多编码规范上都指出不要使用线程静态&#xff08;ThreadStatic&#xff09;&#xff0c;这主要是为了防止在使用的时候出现意外。当有的时候这个线程静态确实会带来一些好处&#xff0c;如何取舍就要看具体情况了。首先&#xff0c;明确一点线程静态与标准静态之间的区别。线…

马上工作了,想问下要注意哪些问题?

这是一位读者在知识星球提问的&#xff0c;涉及的内容很多&#xff0c;但是这些问题&#xff0c;我觉得很多人都需要注意&#xff0c;分享出来让大家看&#xff0c;也希望留言说下自己的看法。1一、 offer情况 1. 已签三方 2. 公司是国内靠前的芯片原厂&#xff0c;深圳&#x…

CSS绘图

1. 自适应的椭圆 背景知识&#xff1a;border-radius属性的基本用法 使用border-radius制作一个圆很简单&#xff0c;只要给任何正方形元素设置固定宽高及一半长度以上的border-radius&#xff0c;就可以得到圆形 1234background: #fb3;width: 200px;height: 200px;border-radi…

JFrame和Frame的区别

在AMT组件中分为两大类&#xff0c;这两类的基类分别是Component和MenuComponent&#xff0c;其中&#xff0c;MenuComponent是所有与菜单相关组件的父类&#xff0c;Component则是除菜单外其他AMT组件的父类&#xff0c;它表示一个能以图形化方式显示出来&#xff0c;并可与用…

51单片机——定时器

单片机——定时器 宗旨&#xff1a;技术的学习是有限的&#xff0c;分享的精神是无限的。 1、定时器和计数器 时钟周期&#xff1a;单片机时序中的最小单位&#xff0c;集体计算的放法就是时钟源分之一 机器周期&#xff1a;单片机完成一个操作的最短时间&#xff0c;12个时钟…

当年要是这样搞,我的C++也不至于这样!

C一直被称作永不过时的开发语言&#xff0c;比如游戏、服务器、人工智能等领域都必须用到C&#xff01;虽然网上有很多教程和资料&#xff0c;但仍有很多人说C难学&#xff0c;究其原因是没有找到正确的学习方法&#xff01;GoogleTest框架一直广泛应用于C/C项目测试 &#xff…