layer ui 导入文件之前传入数据的实例


Posted in Javascript onSeptember 23, 2019

最近用layer ui上传文件遇到了一个问题,我想在上传文件之前把data-id传入后台,layer文档找了一下也没有找到类似的说明,经过一番折腾发现了其中的窍门,这里记录一下

html代码

<button type="button" data-id="1" class="layui-btn test1">导入路由表</button>
<button type="button" data-id="2" class="layui-btn test1">导入路由表</button>
<button type="button" data-id="3" class="layui-btn test1">导入路由表</button>
<button type="button" data-id="4" class="layui-btn test1">导入路由表</button>

javascript代码

var uploadInst;//这里设置一个全局变量记录layer的对象

  $(".test1").click(function () {//这里绑定点击事件
    var game_id = $(this).attr('data-id');//取出data-id的值
    uploadInst.config.data.game_id=game_id//这里设置data的值之后就能传入后台了

  });
  layui.use('upload', function(){
    var upload = layui.upload;
    //执行实例
    uploadInst = upload.render({
      elem: '.test1' //绑定元素
      ,url: $("#upload_url").val()+'?game_id='+$("#get_data").val() //上传接口
      ,accept: 'file' //普通文件
      ,done: function(res){
        layer.msg(res.msg)
        //上传完毕回调
      }
      ,error: function(){
        //请求异常回调
      }
      ,before:function () {

      }
    });

  });

以上这篇layer ui 导入文件之前传入数据的实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
基于jQuery UI CSS Framework开发Widget的经验
Aug 21 Javascript
兼容ie、firefox的图片自动缩放的css跟js代码分享
Jan 21 Javascript
JSON为什么那样红为什么要用json(另有洞天)
Dec 26 Javascript
jquery map方法使用示例
Apr 23 Javascript
可以浮动某个物体的jquery控件用法实例
Jul 24 Javascript
jQuery简易时光轴实现方法示例
Mar 13 Javascript
微信小程序调用PHP后台接口 解析纯html文本
Jun 13 Javascript
BootStrap Table前台和后台分页对JSON格式的要求
Jun 28 Javascript
老生常谈js中的MVC
Jul 25 Javascript
Vue 实时监听窗口变化 windowresize的两种方法
Nov 06 Javascript
Node.js在图片模板上生成二维码图片并附带底部文字说明实现详解
Aug 07 Javascript
ant design的table组件实现全选功能以及自定义分页
Nov 17 Javascript
Node.js实现简单管理系统
Sep 23 #Javascript
webpack的pitching loader详解
Sep 23 #Javascript
layui 富文本图片上传接口与普通按钮 文件上传接口的例子
Sep 23 #Javascript
深入探索VueJS Scoped CSS 实现原理
Sep 23 #Javascript
小程序实现锚点滑动效果
Sep 23 #Javascript
React Native 混合开发多入口加载方式详解
Sep 23 #Javascript
Node.js HTTP服务器中的文件、图片上传的方法
Sep 23 #Javascript
You might like
域名和cookie问题(域名后缀)
2012/10/10 PHP
php实现的九九乘法口诀表简洁版
2014/07/28 PHP
Yii框架 session 数据库存储操作方法示例
2019/11/18 PHP
腾讯的ip接口 方便获取当前用户的ip地理位置
2010/11/25 Javascript
解析javascript 实用函数的使用详解
2013/05/10 Javascript
js 日期比较相关天数代码
2014/04/02 Javascript
jquery使用each方法遍历json格式数据实例
2015/05/18 Javascript
AngularJS  ng-table插件设置排序
2016/09/21 Javascript
如何判断出一个js对象是否一个dom对象
2016/11/24 Javascript
jquery easyui DataGrid简单示例
2017/01/23 Javascript
AngularJS实现动态添加Option的方法
2017/05/17 Javascript
vue 中自定义指令改变data中的值
2017/06/02 Javascript
JavaScript中数组常见操作技巧
2017/09/01 Javascript
vue2.0使用swiper组件实现轮播的示例代码
2018/03/03 Javascript
vue移动端监听滚动条高度的实现方法
2018/09/03 Javascript
浅谈vue 单文件探索
2018/09/05 Javascript
微信小程序实现多个按钮的颜色状态转换
2019/02/15 Javascript
es6函数之箭头函数用法实例详解
2020/04/25 Javascript
[13:18]《一刀刀一天》之DOTA全时刻21:详解TI新赛制 A队再露獠牙
2014/06/24 DOTA
[01:14:19]NAVI vs Mineski 2019国际邀请赛淘汰赛 败者组BO1 8.20.mp4
2020/07/19 DOTA
Python中elasticsearch插入和更新数据的实现方法
2018/04/01 Python
tensorflow 获取模型所有参数总和数量的方法
2018/06/14 Python
Python3.6简单的操作Mysql数据库的三个实例
2018/10/17 Python
PyCharm配置mongo插件的方法
2018/11/30 Python
Python实现计算字符串中出现次数最多的字符示例
2019/01/21 Python
20行python代码实现人脸识别
2019/05/05 Python
Python 脚本实现淘宝准点秒杀功能
2019/11/13 Python
tensorflow -gpu安装方法(不用自己装cuda,cdnn)
2020/01/20 Python
Python 生成VOC格式的标签实例
2020/03/10 Python
波兰运动鞋网上商店:e-Sporting
2018/02/16 全球购物
python+selenium小米商城红米K40手机自动抢购的示例代码
2021/03/24 Python
金融行业职业生涯规划范文
2014/01/17 职场文书
九年级语文教学反思
2014/02/04 职场文书
高中学生干部学习的自我评价
2014/02/21 职场文书
培训心得体会怎么写
2016/01/25 职场文书
Mysql分库分表之后主键处理的几种方法
2022/02/15 MySQL