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 相关文章推荐
直接生成打开窗口代码,不必下载
May 14 Javascript
javascript DOM编程实例(智播客学习)
Nov 23 Javascript
Javascript Cookie读写删除操作的函数
Mar 02 Javascript
如何让页面加载完成后执行js
Jun 26 Javascript
jQuery Mobile的loading对话框显示/隐藏方法分享
Nov 26 Javascript
IE6下拉框图层问题探讨及解决
Jan 03 Javascript
jquery操作checkbox示例分享
Jul 21 Javascript
jQuery获取checkboxlist的value值的方法
Sep 27 Javascript
安装使用Mongoose配合Node.js操作MongoDB的基础教程
Mar 01 Javascript
Vue+abp微信扫码登录的实现代码示例
Jan 06 Javascript
js+cavans实现图片滑块验证
Sep 29 Javascript
详解Vue3使用axios的配置教程
Apr 29 Vue.js
使用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
实用函数9
2007/11/08 PHP
PHP中extract()函数的定义和用法
2012/08/17 PHP
让CodeIgniter的ellipsize()支持中文截断的方法
2014/06/12 PHP
thinkphp多表查询两表有重复相同字段的完美解决方法
2016/09/22 PHP
php安装扩展mysqli的实现步骤及报错解决办法
2017/09/23 PHP
php实现socket推送技术的示例
2017/12/20 PHP
PHP创建XML的方法示例【基于DOMDocument类及SimpleXMLElement类】
2019/09/10 PHP
Prototype RegExp对象 学习
2009/07/19 Javascript
jQuery 使用手册(六)
2009/09/23 Javascript
HTA版JSMin(省略修饰语若干)基于javascript语言编写
2009/12/24 Javascript
基于jquery的cookie的用法
2011/01/10 Javascript
node.js使用nodemailer发送邮件实例
2014/03/10 Javascript
在jquery boxy中添加百度地图坐标拾取注意流程
2014/04/03 Javascript
JavaScript子窗口调用父窗口变量和函数的方法
2015/10/09 Javascript
FullCalendar日历插件应用之数据展现(一)
2015/12/23 Javascript
JS组件Bootstrap Table使用方法详解
2016/02/02 Javascript
js内置对象处理_打印学生成绩单的简单实现
2016/09/24 Javascript
Javascript基础回顾之(一) 类型
2017/01/31 Javascript
80%应聘者都不及格的JS面试题
2017/03/21 Javascript
微信小程序自定义tabBar在uni-app的适配详解
2019/09/30 Javascript
vue中的v-model原理,与组件自定义v-model详解
2020/08/04 Javascript
Vue中正确使用Element-UI组件的方法实例
2020/10/13 Javascript
使用python绘制常用的图表
2016/08/27 Python
python 剪切移动文件的实现代码
2018/08/02 Python
python遍历文件目录、批量处理同类文件
2019/08/31 Python
python实现简单银行管理系统
2019/10/25 Python
用opencv给图片换背景色的示例代码
2020/07/08 Python
自然健康的概念:Natural Healthy Concepts
2020/01/26 全球购物
什么是用户模式(User Mode)与内核模式(Kernel Mode) ?
2014/07/21 面试题
学校岗位设置方案
2014/01/16 职场文书
体育教学随笔感言
2014/02/24 职场文书
幼儿园端午节活动方案
2014/08/25 职场文书
检讨书范文500字
2015/01/28 职场文书
2019脱贫攻坚工作总结报告范本!
2019/08/06 职场文书
《工作是最好的修行》读后感3篇
2019/12/13 职场文书
关于springboot 配置date字段返回时间戳的问题
2021/07/25 Java/Android