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 相关文章推荐
IE和FireFox(FF)中js和css的不同
Apr 13 Javascript
jQuery 表格插件整理
Apr 27 Javascript
js对象与打印对象分析比较
Apr 23 Javascript
Enter转换为Tab的小例子(兼容IE,Firefox)
Nov 14 Javascript
jQuery操作基本控件方法实例分析
Dec 31 Javascript
Web制作验证码功能实例代码
Jun 19 Javascript
jQuery阻止事件冒泡实例分析
Jul 03 jQuery
搭建基于express框架运行环境的方法步骤
Nov 15 Javascript
解决微信小程序scroll-view组件无横向滚动的问题
Feb 04 Javascript
vue 解决兄弟组件、跨组件深层次的通信操作
Jul 27 Javascript
vue使用svg文件补充-svg放大缩小操作(使用d3.js)
Sep 22 Javascript
vuecli项目构建SSR服务端渲染的实现
Oct 30 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
常用的php ADODB使用方法集锦
2008/03/25 PHP
用php解析html的实现代码
2011/08/08 PHP
php获取新浪微博数据API实例
2013/11/12 PHP
PHP中的插件机制原理和实例
2014/07/08 PHP
php数组随机排序实现方法
2015/06/13 PHP
php递归实现无限分类的方法
2015/07/28 PHP
PHP扩展Memcache分布式部署方案
2015/12/06 PHP
PHP从二维数组得到N层分类树的实现代码
2016/10/11 PHP
JavaScript高级程序设计阅读笔记(十六) javascript检测浏览器和操作系统-detect.js
2012/08/14 Javascript
javaScript使用EL表达式的几种方式
2014/05/27 Javascript
jQuery选择器源码解读(七):elementMatcher函数
2015/03/31 Javascript
JQuery节点元素属性操作方法
2015/06/11 Javascript
JS+CSS实现的竖向简洁折叠菜单效果代码
2015/10/22 Javascript
JavaScript的Number对象的toString()方法
2015/12/18 Javascript
浅谈JS中json数据的处理
2016/06/30 Javascript
jQuery实现的简单百分比进度条效果示例
2016/08/01 Javascript
jquery注册文本框获取焦点清空,失去焦点赋值的简单实例
2016/09/08 Javascript
JS判断两个对象内容是否相等的方法示例
2017/04/10 Javascript
EasyUI在Panel上动态添加LinkButton按钮
2017/08/11 Javascript
vue获取dom元素注意事项
2017/12/28 Javascript
小程序登录/注册页面设计的实现代码
2019/05/24 Javascript
Vue封装的组件全局注册并引用
2019/07/24 Javascript
jQuery实现每日秒杀商品倒计时功能
2019/09/06 jQuery
微信小程序自定义模态弹窗组件详解
2019/12/24 Javascript
vue iview实现动态新增和删除
2020/06/17 Javascript
Python面向对象编程中关于类和方法的学习笔记
2016/06/30 Python
基于Python 装饰器装饰类中的方法实例
2018/04/21 Python
Django为窗体加上防机器人的验证码功能过程解析
2019/08/14 Python
python制作英语翻译小工具代码实例
2019/09/09 Python
通过自学python能找到工作吗
2020/06/21 Python
商务日语专业毕业生自荐信
2014/03/27 职场文书
大学毕业典礼演讲稿
2014/09/09 职场文书
蓬莱阁导游词
2015/02/04 职场文书
工作态度恶劣检讨书
2015/05/06 职场文书
食品卫生管理制度
2015/08/06 职场文书
小学校园广播稿
2015/08/18 职场文书