JS实现将链接生成二维码并转为图片的方法


Posted in Javascript onMarch 17, 2018

本文实例讲述了JS实现将链接生成二维码并转为图片的方法。分享给大家供大家参考,具体如下:

<div id="code"></div>
<img id="img"/>
<script type="text/javascript">
  var qrcode=$("#code").qrcode({
    render:'canvas||table',
    width: 200, //宽度
    height:200, //高度
    text: "http://www.baidu.com" //任意内容
  }).hide();
  var canvas=qrcode.find('canvas').get(0);
  //如果有循环,此句必不可少 qrcode.find('canvas').remove();
  var data = canvas.toDataURL('image/jpg');
  $('#img').attr('src',data) ;
  saveFile(data,"fd范德萨范德萨");
  //转为图片的方法,需要上门的data
  function saveFile(data,filename){
    var save_link=document.createElementNS('http://www.w3.org/1999/xhtml', 'a');
    save_link.href=data;
    save_link.download=filename;
    var event=document.createEvent('MouseEvents');
    event.initMouseEvent('click',true,false,window,0,0,0,0,0,false,false,false,false,0,null);
    save_link.dispatchEvent(event);
  };
</script>

注:这里使用了qrcodejs插件,github可参考https://github.com/davidshimjs/qrcodejs

Javascript 相关文章推荐
对联广告js flash激活
Oct 19 Javascript
filemanage功能中用到的lib.js
Apr 08 Javascript
Extjs4 Treegrid 使用心得分享(经验篇)
Jul 01 Javascript
JavaScript中扩展Array contains方法实例
Aug 23 Javascript
Bootstrap按钮下拉菜单组件详解
May 10 Javascript
[原创]SyntaxHighlighter自动识别并加载脚本语言
Feb 07 Javascript
Vue响应式原理详解
Apr 18 Javascript
纯JS实现图片验证码功能并兼容IE6-8(推荐)
Apr 19 Javascript
Vue计算属性的使用
Aug 04 Javascript
在vue里使用codemirror遇到的问题
Nov 01 Javascript
小白教程|一小时上手最流行的前端框架vue(推荐)
Apr 10 Javascript
ajax请求前端跨域问题原因及解决方案
Oct 16 Javascript
基于vue1和vue2获取dom元素的方法
Mar 17 #Javascript
解决vue页面DOM操作不生效的问题
Mar 17 #Javascript
vue中实现先请求数据再渲染dom分享
Mar 17 #Javascript
vue 每次渲染完页面后div的滚动条保持在最底部的方法
Mar 17 #Javascript
vue获取当前激活路由的方法
Mar 17 #Javascript
vue 实现复制内容到粘贴板clipboard的方法
Mar 17 #Javascript
echarts鼠标覆盖高亮显示节点及关系名称详解
Mar 17 #Javascript
You might like
apache+php+mysql安装配置方法小结
2010/08/01 PHP
PHP的简易冒泡法代码分享
2012/08/28 PHP
Php中用PDO查询Mysql来避免SQL注入风险的方法
2013/04/25 PHP
关于url地址传参数时字符串有回车造成页面脚本赋值失败的解决方法
2013/06/28 PHP
PHP实现的增强性mhash函数
2015/05/27 PHP
php遍历解析xml字符串的方法
2016/05/05 PHP
php生成毫秒时间戳的实例讲解
2017/09/22 PHP
PHP长网址与短网址的实现方法
2017/10/13 PHP
jQuery 学习入门篇附实例代码
2010/03/16 Javascript
DWR实现模拟Google搜索效果实现原理及代码
2013/01/30 Javascript
js形成页面的一种遮罩效果实例代码
2014/01/04 Javascript
JQuery中绑定事件(bind())和移除事件(unbind())
2015/02/27 Javascript
老生常谈javascript的类型转换
2016/10/12 Javascript
JavaScript重定向URL参数的两种方法小结
2016/10/19 Javascript
JavaScript中String对象的方法介绍
2017/01/04 Javascript
Javascript 一些需要注意的细节(必看篇)
2017/07/08 Javascript
详解如何解决Vue和vue-template-compiler版本之间的问题
2018/09/17 Javascript
微信小程序转化为uni-app项目的方法示例
2020/05/22 Javascript
[06:43]DAC2018 4.5 SOLO赛 Maybe vs Paparazi
2018/04/06 DOTA
[01:31:02]TNC vs VG 2019国际邀请赛淘汰赛 胜者组赛BO3 第一场
2019/08/22 DOTA
[01:11:28]DOTA2-DPC中国联赛定级赛 RNG vs Phoenix BO3第一场 1月8日
2021/03/11 DOTA
Python使用Phantomjs截屏网页的方法
2018/05/17 Python
数组保存为txt, npy, csv 文件, 数组遍历enumerate的方法
2018/07/09 Python
Python基于递归算法求最小公倍数和最大公约数示例
2018/07/27 Python
8种用Python实现线性回归的方法对比详解
2019/07/10 Python
python3 re返回形式总结
2020/11/20 Python
html5触摸事件判断滑动方向的实现
2018/06/05 HTML / CSS
美国转售二手商品的电子商务平台:BLINQ
2018/12/13 全球购物
金融专业个人求职信范文
2013/11/28 职场文书
50岁生日感言
2014/01/23 职场文书
亲子阅读的活动方案
2014/08/15 职场文书
2015年服务员工作总结
2015/04/08 职场文书
首席执行官观后感
2015/06/03 职场文书
详解Python如何批量采集京东商品数据流程
2022/01/22 Python
Python进程池与进程锁之语法学习
2022/04/11 Python
Nginx配置之禁止指定IP访问
2022/05/02 Servers