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 相关文章推荐
用js实现下载远程文件并保存在本地的脚本
May 06 Javascript
IE innerHTML,outerHTML所引起的问题
Jun 04 Javascript
JavaScript设置首页和收藏页面的小例子
Nov 11 Javascript
js倒计时简单实现方法
Dec 17 Javascript
值得分享和收藏的xmlplus组件学习教程
May 05 Javascript
vue实现密码显示隐藏切换功能
Feb 23 Javascript
Vue实现一个无限加载列表功能
Nov 13 Javascript
vue文件运行的方法教学
Feb 12 Javascript
详解新手使用vue-router传参时注意事项
Jun 06 Javascript
微信小程序8种数据通信的方式小结
Feb 03 Javascript
原生javascript运动函数的封装示例【匀速、抛物线、多属性的运动等】
Feb 23 Javascript
vue 给数组添加新对象并赋值
Apr 20 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
php 将excel导入mysql
2009/11/09 PHP
PHP MemCached 高级缓存应用代码
2010/08/05 PHP
PHP mkdir()无写权限的问题解决方法
2014/06/19 PHP
PHP获取一个字符串中间一部分字符的方法
2014/08/19 PHP
php使用GD实现颜色渐变实例
2015/06/02 PHP
PHP获取当前相对于域名目录的方法
2015/06/26 PHP
php实现的XML操作(读取)封装类完整实例
2017/02/23 PHP
关于使用runtimeStyle属性问题讨论文章
2007/03/08 Javascript
浅谈JavaScript的Polymer框架中的behaviors对象
2015/07/29 Javascript
uploadify多文件上传参数设置技巧
2015/11/16 Javascript
jQuery给元素添加样式的方法详解
2015/12/30 Javascript
jQuery div拖拽用法实例
2016/01/14 Javascript
Javascript 6里的4个新语法
2016/08/25 Javascript
微信小程序开发之视频播放器 Video 弹幕 弹幕颜色自定义实例
2016/12/08 Javascript
AngularJS Controller作用域
2017/01/09 Javascript
JS简单判断函数是否存在的方法
2017/02/13 Javascript
详解JS获取HTML DOM元素的8种方法
2017/06/17 Javascript
jQuery实现frame之间互通的方法
2017/06/26 jQuery
angular6.x中ngTemplateOutlet指令的使用示例
2018/08/09 Javascript
tsconfig.json配置详解
2019/05/17 Javascript
React学习之JSX与react事件实例分析
2020/01/06 Javascript
vue 组件基础知识总结
2021/01/26 Vue.js
在matplotlib的图中设置中文标签的方法
2018/12/13 Python
Django用户登录与注册系统的实现示例
2020/06/03 Python
Python celery原理及运行流程解析
2020/06/13 Python
香港莎莎官网Sasa.com:亚洲著名国际化妆品商城
2019/11/10 全球购物
建筑施工员岗位职责
2013/11/26 职场文书
普通院校学生的自荐信
2013/11/27 职场文书
网络维护中文求职信
2014/01/03 职场文书
六十大寿答谢词
2014/01/12 职场文书
新护士岗前培训制度
2014/02/02 职场文书
如何写求职信
2014/05/24 职场文书
改进作风怎么办发言材料
2014/08/17 职场文书
2015羊年春节慰问信
2015/02/14 职场文书
英语教师求职信范文
2015/03/20 职场文书
使用Bandicam录制鼠标指针并附带点击声音,还可以添加点击动画效果
2022/04/11 数码科技