<div id="container">这里是二维码显示位置</div>
<script language="JavaScript">
$(function(){
var options = {
render: "canvas",
ecLevel: 'H',//识别度
fill: '#000',//二维码颜色
background: '#ffffff',//背景颜色
quiet: 2,//边距
width: 200,//宽度
height: 200,
text: "http://www.whui.org",//二维码内容
//中间logo start
mode: 4,
mSize: 11 * 0.01,
mPosX: 50 * 0.01,
mPosY: 50 * 0.01,
image:$('#img-buffer')[0],//logo图片
//中间logo end
label: 'jQuery.qrcode',
fontname: 'Ubuntu',
fontcolor: '#ff9818',
};
$('#container').empty().qrcode(options);
})
</script>

注意:

增加中间logo的时候,

嵌入的 logo 的 img 对象 <img src="">,直接传 logo 的 url 并没有用,会直接报错出来,必须用img标签的形式。

当 render 为 canvas 时, img.src 可为 非同域
当 render 为 image 时, img.src 必须为 同域,否则会因为跨域的问题导致报错

jquery.qrcode 生成二维码带logo的更多相关文章

  1. (转)js jquery.qrcode生成二维码 带logo 支持中文

    场景:公司最最近在开发二维码支付业务,所以需要做一个html5中的二维码生成和部署! 前天用js生成二维码,节省服务器资源及带宽 原版jquery.qrcode不能生成logo,本文采用的是修改版 1 ...

  2. 使用jquery.qrcode生成二维码支持logo,和中文

    /* utf.js - UTF-8 <=> UTF-16 convertion * * Copyright (C) 1999 Masanao Izumo <iz@onicos.co. ...

  3. C# 生成二维码(带Logo)

    C# 生成二维码(带Logo) 第一种方式 我们需要引用 ThoughtWorks.QRCode.dll  生成带logo二维码(framework4.0以上) 下载地址:https://pan.ba ...

  4. 使用jquery.qrcode生成二维码及常见问题解决方案

    转载文章  使用jquery.qrcode生成二维码及常见问题解决方案 一.jquery.qrcode.js介 jquery.qrcode.js 是一个纯浏览器 生成 QRcode 的 jQuery ...

  5. 使用jquery.qrcode生成二维码实现微信分享功能

    前言: 最近有个这样的需求,在pc端的商品详情页增加分享功能. 微博分享.QQ好友分享.QQ空间分享这些都很常见.但是微信分享我还没有手动写过(以前改过). 最终效果如下图: 解决方案:使用jquer ...

  6. jquery动态生成二维码添加自定义logo

    动态生成二维码中间带logo. jquery.qrcode.js 动态生成二维码api很简单. 引入jquer(版本任意),引入jquery.qrcode.js 不需要中间带logo这样就可以了.带l ...

  7. 使用jquery.qrcode生成二维码(转)

    jQuery 的 qrcode 插件就可以在浏览器端生成二维码图片. 这个插件的使用非常简单: 1.首先在页面中加入jquery库文件和qrcode插件. <script type=" ...

  8. jQuery.qrcode 生成二维码,并使用 jszip、FileSaver 下载 zip 压缩包至本地。

    生成二维码 引用 jquery.qrcode.js  :连接:https://files.cnblogs.com/files/kitty-blog/jquery.qrcode.js .https:// ...

  9. jquery.qrcode生成二维码支持中文

    基本使用方法: 1.首先在页面中加入jquery库文件和qrcode插件. <script type="text/javascript" src="jquery.j ...

随机推荐

  1. exel中合并一列相同的数据到一行

    Sub 按钮1_Click() Application.ScreenUpdating = False arr = Range("a1:c" & [a65536].End(x ...

  2. nuget 服务器

    https://nuget.cnblogs.com/v3/index.json http://nuget.lzzy.net/api/v2 https://www.nuget.org/api/v2/ h ...

  3. nancy中视图呈现 Html.Partial(RenderPage的替代品)

    在mvc中有RenderPage 用来呈现其他视图的内容,而在nancy中没有RenderPage.怎么办呢? mvc中RenderPage的替代品,就是 Html.Partial. 使用方式 @Ht ...

  4. AFNetworking的POST上传

    - (void)download { // 1.创建网络管理者 // AFHTTPSessionManager 基于NSURLSession AFHTTPSessionManager *manager ...

  5. 一、Hello World

    刚创建的Android项目是一个基础的Hello World项目,包含一些默认文件,我们需要花一点时间看看最重要的部分: activity_main.xml  -- 这是刚才用Android Stud ...

  6. JPA,EclipseLink 缓存机制学习(一) 树节点搜索问题引发的思考

    最近在项目在使用JPA+EclipseLink 的方式进行开发,其中EclipseLink使用版本为2.5.1.遇到一些缓存方面使用不当造成的问题,从本篇开始逐步学习EclipseLink的缓存机制. ...

  7. easyX最新版在VS2015上的问题解决啦啦

    7.10 修改完easyX的路径,只剩下一个问题 []无法解析的外部符号_iob_func,该符号在函数“”中被引用 []1个无法解析的外部命令 原因: 版本的问题,代码已经编译过了,但是是2012版 ...

  8. Linux中的shell

    shell的含义: 首先shell的英文含义是"壳": 它是相对于内核来说的,因为它是建议在核的基础上,面向于用户的一种表现形式,比如我们看到一个球,见到的是它的壳,而非核. Li ...

  9. Evolutionary Computing: 5. Evolutionary Strategies(1)

    resource: Evolutionary computing, A.E.Eiben Outline What is Evolution Strategies Introductory Exampl ...

  10. KEGG数据库

    参考:KEGG数据库中文教程 - 博奥  &[学习笔记]KEGG数据库 - 微信 学习一个技能最主要的事情你必须知道,那就是能通过它来做什么? KEGG数据库里面有什么? 如何查询某一特定的代 ...