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

引入js:

require.config({
baseUrl : "/",
paths: {
jquery:'plugin/jquery/jquery-3.1.0.min',
qrcode:'plugin/qrcode/qrcode'
}
}); require(
[
'jquery',
'qrcode'
],
function($){
xxxx..
}
)

待渲染的dom:

<div id="qrcodeCanvas"></div>

初始化二维码:

$('#qrcodeCanvas').qrcode({
text: "http://h5.sztoda.cn/base/login",
background: "#CCC",//背景
foreground: "#FFF",//前景
width: 100,//宽
height: 100,//高
});

值得注意的是,“text”如果是链接且需要自动跳转,只需带上http://开头即可

效果图:

参考:

qrcode.js下载地址 http://cdn.staticfile.org/jquery.qrcode/1.0/jquery.qrcode.min.js

js生成带参的二维码的更多相关文章

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

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

  2. jQuery-qrcode.js 生成带Logo 的二维码

    引入文件  jQuery-qrcode.js 地址:https://blog-static.cnblogs.com/files/kitty-blog/jquery-qrcode.js https:// ...

  3. js生成带logo的二维码

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

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

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

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

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

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

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

  7. 微信公众号生成带参数的二维码asp源码下载

    晚上闲着没事,一个朋友联系,让帮忙写一个微信公众号利用asp生成带参数的二维码,别人扫了后如果已经关注过该公众号的,则直接进入公众号里,如果没关注则提示关注,关注后自动把该微信用户资料获取到并且保存入 ...

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

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

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

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

随机推荐

  1. Redis 学习(二)

    Redis可以存储以下5种数据类型 1. String 字符串 整数 浮点 2. List   一个链表 3. Set  无序收集器 4. Hash  无序散列表 5. Zset   有序集合

  2. Maven_profile_使用profile配置不同环境的properties(实践)

    配置方法分为以下几个步骤: 1.配置profiles节点(pom.xml) 2.配置build节点(pom.xml)--如果不配置该节点则无法找到profile中的properties属性值,并且配置 ...

  3. 由Memcached升级到 Couchbase的 Java 客户端的过程记录(一)

    背景: 在项目启动的选用了Memcached 作为缓存服务器,采用了Xmemcached作为客户端.在项目中使用了Shiro,为了给 Shiro 配置缓存的时候,采用了开源代码   https://g ...

  4. angular指令深度学习篇

    angular指令深度学习-过滤器 limitTo ... <body ng-app="app" > <div ng-controller="myCtr ...

  5. 动手实验iptables的NAT功能实现流量穿透

    1.NAT和iptables理论见: http://lustlost.blog.51cto.com/2600869/943110 2.引子 近期,有同事抱怨说数据入库时,由于数据库所在的服务器只有内网 ...

  6. 你所不了解的float(滥用float的怪异现象)

    float设计初衷就是为了实现文字环绕效果 原本页面流布局显示如上图所示,运用了float属性后就显示为如下图所示,这就是浮动的设计初衷 float的一些特性:包裹性.破坏性. 包裹的特性其实主要有三 ...

  7. JQ001-认识jQuery 和 JQ002-jQuery选择器

    JQ001-认识jQuery jQuery环境配置:将jQuery.js文件引入到html页面中即可. 代码如下: <!DOCTYPE html> <html> <hea ...

  8. 再次认识ASP.NET MVC

    MVC, V,就是View.视图 M,只应该是ViewModel.视图模型 C,Controller.控制器 我们需要怎么看待并使用这三者. 从你敲入url,我们可以做为入口. 当你敲入url并按了回 ...

  9. e-chart 本地加载中国地图

    <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding= ...

  10. jenkins使用简记

    一.安装 jenkins有多种安装方式,可以使用内嵌的Servlet容器运行,也可以基于Apache运行,也可以安装成Linux或Windows服务. 1.使用 Servlet 容器运行 从官网下载 ...