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 相关文章推荐
jQuery formValidator表单验证插件开源了 含API帮助、源码、示例
Aug 14 Javascript
JavaScript 实现模态对话框 源代码大全
May 02 Javascript
Javascript 继承机制的实现
Aug 12 Javascript
JS关键字变色实现思路及代码
Feb 21 Javascript
JQuery异步获取返回值中文乱码的解决方法
Jan 29 Javascript
jquery实现简单的自动播放幻灯片效果
Jun 13 Javascript
微信小程序 LOL 英雄介绍开发实例
Sep 30 Javascript
使用canvas进行图像编辑的实例
Aug 29 Javascript
javaScript实现鼠标在文字上悬浮时弹出悬浮层效果
Apr 12 Javascript
angularJS自定义directive之带参方法传递详解
Oct 09 Javascript
Vue SSR 即时编译技术的实现
May 06 Javascript
Javascript实现单选框效果
Dec 09 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
介绍几个array库的新函数 php
2006/12/29 PHP
PHP下对字符串的递增运算代码
2010/08/21 PHP
PHP中实现获取IP和地理位置类分享
2015/02/10 PHP
详解PHP函数 strip_tags 处理字符串缺陷bug
2017/06/11 PHP
JavaScript 动态将数字金额转化为中文大写金额
2009/05/14 Javascript
Javascript 判断客户端浏览器类型代码
2010/03/01 Javascript
超级有用的13个基于jQuery的内容滚动插件和教程
2011/07/31 Javascript
删除select中所有option选项jquery代码
2013/08/12 Javascript
判断客户浏览器是否支持cookie的示例代码
2013/12/23 Javascript
兼容最新firefox、chrome和IE的javascript图片预览实现代码
2014/08/08 Javascript
Javascript操作表单实例讲解(下)
2016/06/20 Javascript
带有定位当前位置的百度地图前端web api实例代码
2016/06/21 Javascript
jQuery插件autocomplete使用详解
2017/02/04 Javascript
浅谈Postman解决token传参的问题
2018/03/31 Javascript
vue抽出组件并传值实例
2020/07/31 Javascript
vue+Element-ui前端实现分页效果
2020/11/15 Javascript
[04:29]2014DOTA2国际邀请赛 主赛事第三日TOPPLAY
2014/07/21 DOTA
python网页请求urllib2模块简单封装代码
2014/02/07 Python
pyenv命令管理多个Python版本
2017/03/26 Python
Python中扩展包的安装方法详解
2017/06/14 Python
Python随机生成均匀分布在单位圆内的点代码示例
2017/11/13 Python
pycharm中使用anaconda部署python环境的方法步骤
2018/12/19 Python
PyTorch的深度学习入门之PyTorch安装和配置
2019/06/27 Python
python创建ArcGIS shape文件的实现
2019/12/06 Python
详解python tkinter 图片插入问题
2020/09/03 Python
北美个性化礼品商店:Things Remembered
2018/06/12 全球购物
全球采购的街头服饰和帽子:Urban Excess
2020/10/28 全球购物
考博专家推荐信模板
2013/12/02 职场文书
春节联欢晚会主持词范文
2014/03/24 职场文书
小学毕业寄语大全
2014/04/03 职场文书
校园绿化美化方案
2014/06/08 职场文书
安全演讲稿开场白
2014/08/25 职场文书
爱护公物演讲稿
2014/09/09 职场文书
超强台风观后感
2015/06/09 职场文书
《悬崖边的树》读后感2篇
2019/12/02 职场文书
SQL基础查询和LINQ集成化查询
2022/01/18 MySQL