引入文件  jQuery-qrcode.js

地址:https://blog-static.cnblogs.com/files/kitty-blog/jquery-qrcode.js

https://blog-static.cnblogs.com/files/kitty-blog/jquery-qrcode.min.js

1、在页面上写img 标签 src 为 Logo 路径, 如不需要显示 则隐藏。。如 :

 <img src="~/images/Logo.png" class="hidden" id="myLogo" />

2、页面上 写个 div 放 二维码:

  <div id="QRCode"></div>

3、创建 带Logo 的二维码 js d代码:

 //生成二维码
function createCode(QrUrl) {
$("#QRCode").qrcode({
render: "canvas", //也可以替换为table
minVersion: 1, // version range somewhere in 1 .. 40
maxVersion: 40,
ecLevel: 'H', //识别度 'L', 'M', 'Q' or 'H'
left: 0,
top: 0,
size: 100, //尺寸
fill: '#000', //二维码颜色
background: null, //背景色
text: QrUrl, //二维码内容
radius: 0.1, // 0.0 .. 0.5
quiet: 2, //边距
mode: 4,
mSize: 0.2, //图片大小
mPosX: 0.5,
mPosY: 0.5,
label: 'jQuery.qrcode',
fontname: 'sans',
fontcolor: '#000',
image: $('#myLogo')[0]
});
},

jQuery-qrcode.js 生成带Logo 的二维码的更多相关文章

  1. js生成带logo的二维码

    作为一名java程序员,一直以来都是使用服务端生成二维码,最近接触前端的设计,感觉二维码这块如果放到前端去生成,一方面可以减轻服务端的压力,访问带宽,另一方面,前端页面控制比较顺畅 闲话少叙,说下我的 ...

  2. js生成带log的二维码(qrcodejs)

    github: qrcodejs cdn: http://static.runoob.com/assets/qrcode/qrcode.min.js #qrcode #qrcode margin: 2 ...

  3. C#生成带logo的二维码

    带logo的二维码生成分为两步骤:首先根据输入的内容生成二维码图片,然后读取本地的logo图片,通过图片处理生成带logo的二维码. 生成的二维码效果如下: 下面直接贴出二维码生成类   QRCode ...

  4. .NET生成带Logo的二维码

    使用ThoughtWorks.QRCode生成,利用这个库来生成带Logo的二维码(就是中间嵌了一个图片的二维码),直接见代码: HttpContext context = HttpContext.C ...

  5. 涛哥的Python脚本工具箱之生成带Logo的二维码

    近期须要在二维码上加Logo,网上没有找到好用的,于是自己用python写了一个. 须要安装qrcode,PIL库 二维码简称 QR Code(Quick Response Code),学名为高速响应 ...

  6. phpqrcode生成带logo的二维码图片及带文字的二维码图片

    <?php require_once "./phpqrcode/phpqrcode.php"; /** * 这样就可以生成二维码了,实际上在png这个方法里还有几个参数需要使 ...

  7. PHP生成带logo图像二维码的两种方法

    本文主要和大家分享PHP生成带logo图像二维码的两种方法,主要以文字和代码的形式和大家分享,希望能帮助到大家. 一.利用Google API生成二维码Google提供了较为完善的二维码生成接口,调用 ...

  8. C# ZXing.Net生成二维码、识别二维码、生成带Logo的二维码(二)

    1.使用ZXint.Net生成带logo的二维码 /// <summary> /// 生成带Logo的二维码 /// </summary> /// <param name ...

  9. js生成带参的二维码

    最近项目中有需求生成带参的二维码,考虑过用JAVA后台生成返回前端展示,后面了解到用jquery的qrcode.js插件可以很好现实 引入js: require.config({ baseUrl : ...

随机推荐

  1. 在 CentOS 上安装 node.js

    进入到 /usr/local/ 目录中: cd /usr/local/ 创建 nodejs 文件夹: mkdir -p nodejs 进入到 nodejs 目录中: cd nodejs 下载 node ...

  2. 软件项目技术点(2)——Canvas之坐标系转换

    AxeSlide软件项目梳理   canvas绘图系列知识点整理 默认坐标系与当前坐标系 canvas中的坐标是从左上角开始的,x轴沿着水平方向(按像素)向右延伸,y轴沿垂直方向向下延伸.左上角坐标为 ...

  3. 使用angular帮你实现拖拽

    拖拽有多种写法,在这里就看一看angular版的拖拽. <!DOCTYPE html> <html ng-app="myApp"> <head> ...

  4. matlab 中“newff” 函数的参数设置

    matlab 中"newff" 函数的使用方法技巧|和各参数的意义 先来一个简单的源程序让大家练习一下: % Here input P and targets T define a ...

  5. 详解Javaweb中常见漏洞的防御

    上一篇给大家介绍了SpringMVC中常见的客户端数据输入点,这一篇给大家讲解下java中常见漏洞的防御方法. 0x01.sql注入 下面我们就用利用SpringMVC自带的数据库操作类jdbcTem ...

  6. (四)WebDriver常用方法

    点击和输入 前面我们已经学习了定位元素, 定位只是第一步, 定位之后需要对这个元素进行操作, 或单击(按钮) 或输入(输入框) , 下面就来认识 WebDriver 中最常用的几个方法: clear( ...

  7. vue + element-ui 制作tab切换(适用于单页切换不同标记显示不同内容)

    本篇文章使用vue结合element开发tab切换单页不同的标记显示不同的内容. 1.安装element-ui npm install element-ui --save 2.在main.js中引入e ...

  8. 为我们的SSR程序添加热更新功能

    前沿 通过上一篇文章 通过vue-cli3构建一个SSR应用程序 我们知道了什么是SSR,以及如何通过vue-cli3构建一个SSR应用程序.但是最后遗留了一些问题没有处理,就是没有添加开发时的热更新 ...

  9. June 14th 2017 Week 24th Wednesday

    Love looks not with the eyes, but with the mind. 爱,不在眼里,而在心中. Staring in her eyes and you will find ...

  10. Python3基本数据类型(三、列表)

    序列是Python中最基本的数据结构.序列中的每个元素都分配一个数字-它的位置,或索引,第一个索引是0,第二个索引是1,以此类推.Python有6个序列的内置类型,但最常见的是列表和元组.序列都可以进 ...