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 相关文章推荐
javascript 仿QQ滑动菜单效果代码
Sep 03 Javascript
js中哈希表的几种用法总结
Jan 28 Javascript
jQuery实现锚点scoll效果实例分析
Mar 10 Javascript
jQuery获取上传文件的名称的正则表达式
May 21 Javascript
jquery实现倒计时功能
Dec 28 Javascript
轻松搞定jQuery.noConflict()
Feb 15 Javascript
AngularJs表单验证实例详解
May 30 Javascript
Backbone View 之间通信的三种方式
Aug 09 Javascript
Vue2.0利用 v-model 实现组件props双向绑定的优美解决方案
Mar 13 Javascript
关于vue的语法规则检测报错问题的解决
May 21 Javascript
vue实现新闻展示页的步骤详解
Apr 11 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校验ISBN码的函数代码
2011/01/17 PHP
Zend Framework框架教程之Zend_Db_Table_Rowset用法实例分析
2016/03/21 PHP
PHP设计模式之工厂方法设计模式实例分析
2018/04/25 PHP
jQuery 使用手册(一)
2009/09/23 Javascript
javascript 按回车键相应按钮提交事件
2009/11/02 Javascript
一个网马的tips实现分析
2010/11/28 Javascript
ASP中Sub和Function的区别说明
2020/08/30 Javascript
ie中js创建checkbox默认选中问题探讨
2013/10/21 Javascript
如何正确使用javascript 来进行我们的程序开发
2014/06/23 Javascript
javascript实现一个数值加法函数
2015/06/26 Javascript
基于javascript实现图片预加载
2016/01/05 Javascript
JavaScript函数内部属性和函数方法实例详解
2016/03/17 Javascript
jQuery验证插件validate使用方法详解
2020/09/13 Javascript
微信小程序 教程之wxapp视图容器 swiper
2016/10/19 Javascript
巧用Vue.js+Vuex制作专门收藏微信公众号的app
2016/11/03 Javascript
Material(包括Material Icon)在Angular2中的使用详解
2018/02/11 Javascript
解决koa2 ctx.render is not a function报错问题
2018/08/07 Javascript
Vue2.0学习系列之项目上线的方法步骤(图文)
2018/09/25 Javascript
从0到1学习JavaScript编写贪吃蛇游戏
2020/07/28 Javascript
Python装饰器的函数式编程详解
2015/02/27 Python
Python随机生成带特殊字符的密码
2016/03/02 Python
Python走楼梯问题解决方法示例
2018/07/25 Python
django url到views参数传递的实例
2019/07/19 Python
django 控制页面跳转的例子
2019/08/06 Python
Python的历史与优缺点整理
2020/05/26 Python
HTML5混合开发二维码扫描以及调用本地摄像头
2017/12/27 HTML / CSS
加拿大百叶窗和窗帘定制网站:Blinds
2017/01/30 全球购物
Halston Heritage官网:简洁的日装,稍显奢华的晚装
2018/11/20 全球购物
简单的JAVA编程面试题
2013/03/19 面试题
自我鉴定怎么写
2014/01/12 职场文书
情人节寄语大全
2014/04/11 职场文书
卫生院健康教育实施方案
2014/06/07 职场文书
2015年个人实习工作总结
2014/12/12 职场文书
公务员政审材料
2014/12/23 职场文书
检讨书格式
2015/05/07 职场文书
Android Flutter实现3D动画效果示例详解
2022/04/07 Java/Android