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 相关文章推荐
jquery $.each 和for怎么跳出循环终止本次循环
Sep 27 Javascript
JS随机漂浮广告代码具体实例
Nov 19 Javascript
JS实现根据当前文字选择返回被选中的文字
May 21 Javascript
JS使用正则表达式除去字符串中重复字符的方法
Nov 05 Javascript
JS实现部分HTML固定页面顶部随屏滚动效果
Dec 24 Javascript
动态创建按钮的JavaScript代码
Jan 29 Javascript
Bootstrap警告(Alerts)的实现方法
Mar 22 Javascript
JavaScript中splice与slice的区别
May 09 Javascript
微信小程序 wx.request方法的异步封装实例详解
May 18 Javascript
VUE Error: getaddrinfo ENOTFOUND localhost
May 03 Javascript
Node.js 多线程完全指南总结
Mar 27 Javascript
react基本安装与测试示例
Apr 27 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
php二分法在IP地址查询中的应用
2008/08/12 PHP
PHP处理大量表单字段的便捷方法
2015/02/07 PHP
php实现将字符串按照指定距离进行分割的方法
2015/03/14 PHP
三个思路解决laravel上传文件报错:413 Request Entity Too Large问题
2017/11/13 PHP
JS自动缩小超出大小的图片
2012/10/12 Javascript
js实现图片放大缩小功能后进行复杂排序的方法
2012/11/08 Javascript
tangram框架响应式加载图片方法
2013/11/21 Javascript
jQuery实现自动与手动切换的滚动新闻特效代码分享
2015/08/27 Javascript
Angular发布1.5正式版,专注于向Angular 2的过渡
2016/02/18 Javascript
javascript实现平滑无缝滚动
2020/08/09 Javascript
AngularJS实现星星等级评分功能
2016/09/24 Javascript
详解a++和++a的区别
2017/08/30 Javascript
详解node child_process模块学习笔记
2018/01/24 Javascript
详解封装基础的angular4的request请求方法
2018/06/05 Javascript
js实现继承的方法及优缺点总结
2019/05/08 Javascript
layui数据表格实现重载数据表格功能(搜索功能)
2019/07/27 Javascript
js实现随机圆与矩形功能
2020/10/29 Javascript
antd配置config-overrides.js文件的操作
2020/10/31 Javascript
[49:12]完美世界DOTA2联赛PWL S2 Magma vs GXR 第二场 11.29
2020/12/02 DOTA
Python和Perl绘制中国北京跑步地图的方法
2016/03/03 Python
初探TensorFLow从文件读取图片的四种方式
2018/02/06 Python
python正则表达式爬取猫眼电影top100
2018/02/24 Python
在cmd中运行.py文件: python的操作步骤
2018/05/12 Python
Python中分支语句与循环语句实例详解
2018/09/13 Python
python变量赋值方法(可变与不可变)
2019/01/12 Python
利用python开发app实战的方法
2019/07/09 Python
python爬虫 2019中国好声音评论爬取过程解析
2019/08/26 Python
django框架forms组件用法实例详解
2019/12/10 Python
python Cartopy的基础使用详解
2020/11/01 Python
教师一帮一活动总结
2014/07/08 职场文书
竞选班干部演讲稿500字
2014/08/20 职场文书
个人查摆问题整改措施
2014/10/04 职场文书
2014年生产部工作总结
2014/12/17 职场文书
医药公司开票员岗位职责
2015/04/15 职场文书
地道战观后感2000字
2015/06/04 职场文书
mysql中int(3)和int(10)的数值范围是否相同
2021/10/16 MySQL