最近项目中有需求生成带参的二维码,考虑过用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. url 中 # ? & 的作用

    1. # 10年9月,twitter改版.一个显著变化,就是URL加入了"#!"符号.比如,改版前的用户主页网址为http://twitter.com/username改版后,就变 ...

  2. 【转载】浅谈HTTP中Get与Post的区别

    [转载]http://www.cnblogs.com/hyddd/ Http定义了与服务器交互的不同方法,最基本的方法有4种,分别是GET,POST,PUT,DELETE.URL全称是资源描述符,我们 ...

  3. Android,不小心关闭了某个小窗口怎么恢复,方法介绍

    Window > Show View > Other 需要哪个窗口就用哪个~

  4. 关于Scala的一些感想(一)

    最近在完成自己的开源项目Application-center的时候,使用了Scala编程语言. 在使用了一段时间下来以后,有一些不是很"清晰"的感受,说实话我自己还没有很好的整理清 ...

  5. MySQL主从同步延迟

    早上接到open-falcon报警,一台mysql从库同步延迟2w多秒,mysql版本比较老,用的5.1.37. 连接从库查找原因: show processlist一下,查看哪些线程在跑. 看到Ti ...

  6. Startup配置类 居然又是约定

    Microsoft.Owin.Host.SystemWeb 这个dll可以让OWin接管IIS的请求,虽然同样是托管在IIS,但是所有的请求都会被OWin来处理.在OWin的4层结构中(Applica ...

  7. ectouch 常用功能

    1. ectouch销量文件mobile\include\apps\default\common\function.php function get_goods_count($goods_id) { ...

  8. JDK Collection 源码分析(1)—— Collection

    JDK Collection   JDK Collection作为一个最顶层的接口(root interface),JDK并不提供该接口的直接实现,而是通过更加具体的子接口(sub interface ...

  9. 蘑菇街TeamTalk编译连接过程中遇到的问题及解决方法(iOS)

    今天浏览博文的时候,“蘑菇街开源的即时通讯框架,包括iOS.Android.Mac.Windows客户端和后台 Github源码下载地址:https://github.com/mogujie/Team ...

  10. 最新的jQuery插件和JavaScript库

    每一个前端开发人员很清楚的重要性和功能的JavaScript库提供.它提供了一个简单的接口,用于构建快速动态的接口,而无需大量的代码. 谢谢你的超级从事jQuery开发者社区,人始终是创造新的和令人惊 ...