layui实现二维码弹窗、并下载到本地的方法


Posted in Javascript onSeptember 25, 2019

在服务器端写好生成二维码的方法,在下面调用

具体实现方法如下,为了方便理解,直接附上源码,加上注释会更加容易理解吧

function share(vote_id){
 		//二维码生成链接
  var url = "{:U('Admin/Vote/logo')}?vote_id="+vote_id;
  //弹窗
  var index = layer.open({
  		//type:1 表示页面层
   type: 1,
   title: '分享二维码',
   //是否点击遮罩关闭
   shadeClose: true,
   //样式类名,可以自定义弹窗样式
   skin:'demo_share',
   //弹层外区域
   shade: 0.3,
   maxmin: false, //开启最大化最小化按钮
   //宽高
   area: ['480px','320px'],
   //内容
   content: "<img src='"+url+"' alt=''>",
   //弹窗下方的按钮
   btn:['<i class="layui-icon" style="margin-right: 10px;"></i>下载图片','取消','确定'],
   //绑定第一个按钮的点击事件
   btn1: function(index) {
				//下载图片到本地
    var a = document.createElement('a');
    var event = new MouseEvent('click');
    a.download = "分享投票二维码";
    a.href = url;
    a.dispatchEvent(event);
   }
  });

 }

若有问题或错误,请小伙伴们在下方留言评论

以上这篇layui实现二维码弹窗、并下载到本地的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Javascript 复制数组实现代码
Nov 26 Javascript
了解jQuery技巧来提高你的代码
Jan 08 Javascript
javascript for循环设法提高性能
Feb 24 Javascript
js 设置缓存及获取设置的缓存
May 08 Javascript
jQuery实现HTML5 placeholder效果实例
Dec 09 Javascript
jQuery中each()方法用法实例
Dec 27 Javascript
jQuery插件pagewalkthrough实现引导页效果
Jul 05 Javascript
jquery事件绑定解绑机制源码解析
Sep 19 Javascript
require.js+vue开发微信上传图片组件
Oct 27 Javascript
Javascript基于jQuery UI实现选中区域拖拽效果
Nov 25 Javascript
详解webpack3编译兼容IE8的正确姿势
Dec 21 Javascript
vue动态渲染svg、添加点击事件的实现
Mar 13 Javascript
使用localStorage替代cookie做本地存储
Sep 25 #Javascript
JavaScript使用localStorage存储数据
Sep 25 #Javascript
Vue路由守卫之路由独享守卫
Sep 25 #Javascript
使用Layer组件弹出多个对话框(非嵌套)与关闭及刷新的例子
Sep 25 #Javascript
Vue利用Blob下载原生二进制数组文件
Sep 25 #Javascript
layui实现图片虚拟路径上传,预览和删除的例子
Sep 25 #Javascript
layui添加动态菜单与选项卡 AJAX请求的例子
Sep 25 #Javascript
You might like
一个更简单的无限级分类菜单代码
2007/01/16 PHP
PHP中动态显示签名和ip原理
2007/03/28 PHP
php设置允许大文件上传示例代码
2014/03/10 PHP
9个经典的PHP代码片段分享
2014/12/18 PHP
phpMyAdmin安装并配置允许空密码登录
2015/07/04 PHP
php文件上传 你真的掌握了吗
2016/11/28 PHP
PHP中数组转换为SimpleXML教程
2019/01/27 PHP
laravel 框架结合关联查询 when()用法分析
2019/11/22 PHP
静态的动态续篇之来点XML
2006/12/23 Javascript
Ruffy javascript 学习笔记
2009/11/30 Javascript
js的参数有长度限制吗?发现不能超过2083个字符
2014/04/20 Javascript
微信WeixinJSBridge API使用实例
2015/05/25 Javascript
JavaScript Math.round() 方法
2015/12/18 Javascript
JavaScript实现使用Canvas绘制图形的基本教程
2016/10/27 Javascript
Angular2利用组件与指令实现图片轮播组件
2017/03/27 Javascript
新手入门带你学习JavaScript引擎运行原理
2019/06/24 Javascript
jQuery实现点击滚动到指定元素上的方法分析
2020/03/19 jQuery
Python脚本判断 Linux 是否运行在虚拟机上
2015/04/25 Python
Python分治法定义与应用实例详解
2017/07/28 Python
如何高效使用Python字典的方法详解
2017/08/31 Python
Python中使用Counter进行字典创建以及key数量统计的方法
2018/07/06 Python
详解CSS 3 中的 calc() 方法
2018/01/12 HTML / CSS
英国最大的奢侈品零售网络商城:Flannels
2016/09/16 全球购物
BookOutlet加拿大:在网上书店购买廉价折扣图书和小说
2018/10/05 全球购物
Chain Reaction Cycles俄罗斯:世界上最大的在线自行车商店
2019/08/27 全球购物
介绍JAVA 中的Collection FrameWork(及如何写自己的数据结构)
2014/10/31 面试题
工程造价管理专业大专生求职信
2013/10/06 职场文书
先进党支部事迹材料
2014/01/13 职场文书
教师节促销活动方案
2014/02/14 职场文书
天猫某品牌专卖店运营计划书
2014/03/21 职场文书
某某同志考察材料
2014/05/28 职场文书
法制宣传标语集锦
2014/06/25 职场文书
学校联谊协议书
2014/09/16 职场文书
践行三严三实心得体会
2014/10/13 职场文书
2014教师年度工作总结
2014/11/10 职场文书
2015社区个人工作总结范文
2015/05/13 职场文书