在日常生活中,随处可见二维码,那么js如何生成动态的专属二维码?其实,通过“二维码插件”我们可以快速生成二维码。在这,记录一下的生成专属二维码demo,一起来看看jquery.qrcode.js是怎么使用的。

相关插件

<!--布局需要一个放canvas画布的容器-->
<div class="myQRcode"></div>
<!--引用相关js:-->
<script src="jquery.min.js"></script>
<script src="utf.js"></script><!--qrcode.js引用utf.js,避免乱码-->
<script src="jquery.qrcode.js"></script>

js的使用

var codeUrl = "https://home.cnblogs.com/u/missme-lina"
$(".myQRcode").qrcode({
render : "canvas", //设置渲染方式,有table和canvas,使用canvas方式渲染性能相对来说比较好
text : codeUrl, //扫描二维码后显示的内容,可以直接填一个网址,扫描二维码后自动跳向该链接
width : "215", //二维码的宽度
height : "215", //二维码的高度
background : "#ffffff", //二维码的后景色
foreground : "#000000", //二维码的前景色
src: 'https://pic.cnblogs.com/avatar/1211848/20190103102237.png' //二维码的logo图
});

实现效果

jquery.qrcode.js的API

请转载官方文档:https://larsjung.de/jquery-qrcode/

demo:动态生成专属二维码的更多相关文章

  1. 微信小程序动态生成保存二维码

    起源:最近小程序需要涉及到一些推广方面的功能,所以要写一个动态生成二维码用户进行下载分享,写完之后受益良多,特此来分享一下: 一.微信小程序动态生成保存二维码 wxml: <view class ...

  2. C# 实现生成带二维码的专属微信公众号推广海报

    原文:C# 实现生成带二维码的专属微信公众号推广海报 很多微信公众号中需要生成推广海报的功能,粉丝获得专属海报后可以分享到朋友圈或发给朋友,为公众号代言邀请好友即可获取奖励的.海报自带渠道二维码,粉丝 ...

  3. python3使用myqr生成链接二维码

    技术背景 二维码技术在各个领域中都已经有非常成熟的应用,比如随处可见的二维码支付,比如疫情期间的绿码,再比如工业领域中,可以使用二维码作为定位的标签,大大提升了室内定位技术的精确度.二维码的格式内容大 ...

  4. pbfunc外部函数扩展应用-直接在Datawindow中生成QR二维码,非图片方式

    利用pbfunc外部函数在Datawindow中直接生成QR二维码,非图片方式.需要注意以下面几点: Datawindow的DataObject的单位必须为像素(Pixels). Datawindow ...

  5. 通过生成支付二维码来实现微信支付的解决方案 - EasyWechat版(转)

    上一篇我们讲了在微信浏览器内实现微信支付的功能,它特别适合于一些基于微信公众号的h5站点等,支付流程也相当流畅,但是... 还有一种情况,比如现在北哥兄弟连PC版,是生成了一个二维码,这个二维码是专属 ...

  6. Android应用--QR的生成(二维码)

    二维码的定义: 二维码(2-dimensional bar code),是用某种特定的几何图形按一定规律在平面(二维方向上)分布的黑白相间的图形记录数据符号信息的. 在许多种类的二维条码中,常用的码制 ...

  7. Unity生成简易二维码

    最近项目需求,需要在Unity中动态生成二维码.所以就研究了一下,下面把动态生成二维码的方法向大家分享一下. 第一种方法 需要一个 ZXing.dll文件. 下载地址我会在文章结尾给出. 直接将下载好 ...

  8. Java生成艺术二维码也可以很简单

    原文点击: Quick-Media Java生成艺术二维码也可以很简单 现在二维码可以说非常常见了,当然我们见得多的一般是白底黑块,有的再中间加一个 logo,或者将二维码嵌在一张特定的背景中(比如微 ...

  9. vue 把后端返回的图片和url链接生成的二维码用canvas 合成一张图片

    H5 页面在做某个活动的时候,有两种分享方式,一种是链接分享,一种是图片分享. 链接分享的话,如果是在微信里,就可引导用户利用微信浏览器自带的分享,根据sdk设置分享标题简介链接缩略图即可. 图片分享 ...

随机推荐

  1. C#.Net平台与OPC服务器通讯

    最近,我们Ndolls工作室承接了山大某个自动化控制项目,主要做了一套工控信息化系统,其中有一个功能模块是将系统管理的一部分数据参数发送至OPC服务器,由OPC服务器接收数据后执行相应工控操作.第一次 ...

  2. MySQL程序端启动密码错误解决方法

    MySQL程序端启动密码错误解决方法 一般启动MySQL程序端,都是用mysql -uroot -p命令,当然前提是你的环境变量已经配好了. 为了连接服务器,当调用mysql时,通常需要提供一个MyS ...

  3. 华硕FX503V 安装ubuntu遇到问题解决

    关机进bios,确保secure boot是关闭的,第一启动项设为带有uefi 的U盘,也就是ubuntu安装盘,F10保存退出; 接下来会进入grub界面,选择install ubuntu,不要按e ...

  4. linux下把动态链接库加入环境变量的几种方式

    一. 将网络SDK各动态库路径加入到LD_LIBRARY_PATH环境变量 1.在终端输入:export LD_LIBRARY_PATH=$LD_LIBRARY_PATH:/XXX 只在当前终端起作用 ...

  5. .NET手记-友盟消息推送服务器端加密算法的实现

    最近为App开发消息推送功能,这里我们采用了友盟的消息推送服务,但其后台简陋,可定制化程度低,所以决定接入服务器端API,在自己的服务器上部署一套推送服务. 其中涉及到很多问题,首先要解决的就是与友盟 ...

  6. Go语言之Interface(一)

    Go语言之Interface(一) 什么是interface 在面向对象语言中接口是:接口定义了一个对象的行为,但在Go中接口就是方法签名的集合,当一个类型提供了这个接口中的所有的方法,就可以说这个类 ...

  7. [EXP]CVE-2018-2628 Weblogic GetShell Exploit

    漏洞简介 漏洞威胁:RCE--远程代码执行 漏洞组件:weblogic 影响版本:10.3.6.0.12.1.3.0.12.2.1.2.12.2.1.3 代码: # -*- coding: utf-8 ...

  8. GNum试用体验

    只需在GNum上注册一个用户名,填上自己的电话号码,它就会自动生成一个URL,你的朋友(可以不注册GNum)在浏览器上进入这个 URL,就可以给你的手机打电话,目前可以免费通话200分钟,而且如果你邀 ...

  9. mysql 开发进阶篇系列 36 工具篇mysqlshow(数据库对象查看工具)

    一.概述 mysqlshow客户端查找工具,能很快地查找存在哪些数据库,数据库中的表,表中的列或索引,和mysql客户端工具很类似,不过有些特性是mysql客户端工具所不具备的. mysqlshow的 ...

  10. mysql 开发进阶篇系列 26 数据库RPM安装演示

    一.概述 上一章讲到了RPM安装后的文件目录,这章还是介绍下安装步骤.也便以后做参考吧. 1. 移出centos 7系统自带的mysql库 yum remove mysql-libs 2. 将下载的m ...