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 EasyUI 中文API Layout(Tabs)
Apr 27 Javascript
jQuery EasyUI API 中文文档 - Tree树使用介绍
Nov 19 Javascript
Jquery的hide及toggle方法让超链接慢慢消失
Sep 06 Javascript
js+HTML5实现canvas多种颜色渐变效果的方法
Jun 05 Javascript
js实现String.Fomat的实例代码
Sep 02 Javascript
JS实用的带停顿的逐行文本循环滚动效果实例
Nov 23 Javascript
jQuery Easyui加载表格出错时在表格中间显示自定义的提示内容
Dec 08 Javascript
javaScript+turn.js实现图书翻页效果实例代码
Feb 16 Javascript
Vue中使用vux的配置详解
May 05 Javascript
jQuery实现div跟随鼠标移动
Aug 20 jQuery
angularjs 的数据绑定实现原理
Jul 02 Javascript
小程序云开发实战小结
Oct 25 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
改造一台复古桌面收音机
2021/03/02 无线电
php下封装较好的数字分页方法
2010/11/23 PHP
解析php 版获取重定向后的地址(代码)
2013/06/26 PHP
Linux+Nginx+MySQL下配置论坛程序Discuz的基本教程
2015/12/23 PHP
非常重要的php正则表达式详解
2016/01/04 PHP
PHP 接入微信扫码支付总结(总结篇)
2016/11/03 PHP
Thinkphp 框架扩展之类库扩展操作详解
2020/04/23 PHP
对联广告js flash激活
2006/10/19 Javascript
IE 下的只读 innerHTML
2009/08/21 Javascript
js post方式传递提交的实现代码
2010/05/31 Javascript
jQuery Jcrop插件实现图片选取功能
2011/11/23 Javascript
JS+CSS实现经典的左侧竖向滑动菜单效果
2015/09/23 Javascript
原生JavaScript制作计算器
2016/10/16 Javascript
JavaScript使用delete删除数组元素用法示例【数组长度不变】
2017/01/17 Javascript
jquery加载单文件vue组件的方法
2017/06/20 jQuery
node通过express搭建自己的服务器
2017/09/30 Javascript
Angular2 父子组件通信方式的示例
2018/01/29 Javascript
详解mpvue开发小程序小总结
2018/07/25 Javascript
setTimeout与setInterval的区别浅析
2019/03/23 Javascript
使用react context 实现vue插槽slot功能
2019/07/18 Javascript
WEEX环境搭建与入门详解
2019/10/16 Javascript
微信小程序上传帖子的实例代码(含有文字图片的微信验证)
2020/07/11 Javascript
node.js如何根据URL返回指定的图片详解
2020/10/21 Javascript
vue中父子组件的参数传递和应用示例
2021/01/04 Vue.js
python单链表实现代码实例
2013/11/21 Python
在arcgis使用python脚本进行字段计算时是如何解决中文问题的
2015/10/18 Python
python opencv图片编码为h264文件的实例
2019/12/12 Python
德国机场停车位比较和预订网站:Ich-parke-billiger
2018/01/08 全球购物
日本小田急百货官网:Odakyu
2018/07/19 全球购物
搬家公司的创业计划书
2014/01/01 职场文书
早读课迟到检讨书
2014/09/25 职场文书
仓库管理员岗位职责
2015/02/03 职场文书
防卫过当辩护词
2015/05/21 职场文书
三好学生主要事迹材料
2015/11/03 职场文书
财产分割协议书
2016/03/22 职场文书
2022微信温控新功能上线
2022/05/09 数码科技