Javascript生成带参数的二维码示例


Posted in Javascript onOctober 10, 2016

前言

在最近的项目中有个需求是要生成带参的二维码,考虑过用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://开头即可

效果图:

Javascript生成带参数的二维码示例

好了,以上就是利用Javascript生成带参数二维码的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,如果有疑问大家可以留言交流。

Javascript 相关文章推荐
firefox中JS读取XML文件
Dec 21 Javascript
js获取单选框或复选框值及操作
Dec 18 Javascript
解决jquery1.9不支持browser对象的问题
Nov 13 Javascript
js中hash和ico的关联分析
Feb 05 Javascript
JS+CSS简单树形菜单实现方法
Sep 12 Javascript
javascript简单比较日期大小的方法
Jan 05 Javascript
详解JavaScript异步编程中jQuery的promise对象的作用
May 03 Javascript
JavaScript地理位置信息API
Jun 11 Javascript
详解puppeteer使用代理
Dec 27 Javascript
微信小程序 可搜索的地址选择实现详解
Aug 28 Javascript
javascript 易错知识点实例小结
Apr 25 Javascript
JS继承最简单的理解方式
Mar 31 Javascript
详细讲解JavaScript中的this绑定
Oct 10 #Javascript
jQuery EasyUI 右键菜单--关闭标签/选项卡的简单实例
Oct 10 #Javascript
jQuery EasyUI右键菜单实现关闭标签/选项卡
Oct 10 #Javascript
JavaScript 判断一个对象{}是否为空对象的简单方法
Oct 09 #Javascript
细数JavaScript 一个等号,两个等号,三个等号的区别
Oct 09 #Javascript
JS获取IE版本号与HTML设置IE文档模式的方法
Oct 09 #Javascript
js实现弹窗居中的简单实例
Oct 09 #Javascript
You might like
改德生G88 - 加装等响度低音提升电路
2021/03/02 无线电
php 处理上百万条的数据库如何提高处理查询速度
2010/02/08 PHP
PHP 抓取网页图片并且另存为的实现代码
2010/03/24 PHP
PHP实现二叉树的深度优先与广度优先遍历方法
2015/09/28 PHP
JavaScript根据数据生成百分比图和柱状图的实例代码
2013/07/14 Javascript
zTree插件之多选下拉菜单实例代码
2013/11/06 Javascript
js实现倒计时时钟的示例代码
2013/12/17 Javascript
JS实现的最简Table选项卡效果
2015/10/14 Javascript
详解AngularJS Filter(过滤器)用法
2015/12/28 Javascript
jQuery判断浏览器并动态调整select宽度的方法
2016/03/02 Javascript
javascript检查某个元素在数组中的索引值
2016/03/30 Javascript
微信小程序前端源码逻辑和工作流
2016/09/25 Javascript
微信小程序 Tab页切换更新数据
2017/01/05 Javascript
Node.js使用gm拼装sprite图片
2017/07/04 Javascript
Vue学习笔记进阶篇之vue-cli安装及介绍
2017/07/18 Javascript
jQuery Layer弹出层传值到父页面的实现代码
2017/08/17 jQuery
React-Router如何进行页面权限管理的方法
2017/12/06 Javascript
Vue2.5学习笔记之如何在项目中使用和配置Vue
2018/09/26 Javascript
javascript中的with语句学习笔记及用法
2020/02/17 Javascript
Vue使用鼠标在Canvas上绘制矩形
2020/12/24 Vue.js
如何在 Vue 表单中处理图片
2021/01/26 Vue.js
仅利用30行Python代码来展示X算法
2015/04/01 Python
详解Python3中的迭代器和生成器及其区别
2018/10/09 Python
python利用Opencv实现人脸识别功能
2019/04/25 Python
python之pymysql模块简单应用示例代码
2019/12/16 Python
使用pandas读取表格数据并进行单行数据拼接的详细教程
2021/03/03 Python
html5 跨文档消息传输示例探讨
2013/04/01 HTML / CSS
Booking.com亚太地区:Booking.com APAC
2020/02/07 全球购物
即将毕业大学生自荐信
2014/01/24 职场文书
授权委托书
2014/07/31 职场文书
《中国梦我的梦》大学生演讲稿
2014/08/20 职场文书
党员四风问题对照检查材料思想汇报
2014/09/16 职场文书
关于运动会的广播稿50字
2014/10/17 职场文书
导游词之无锡梅园
2019/11/28 职场文书
Java8中Stream的一些神操作
2021/11/02 Java/Android
python中pd.cut()与pd.qcut()的对比及示例
2022/06/16 Python