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 相关文章推荐
利用XMLHTTP传递参数在另一页面执行并刷新本页
Oct 26 Javascript
jQuery下扩展插件和拓展函数的写法(匿名函数使用的典型例子)
Oct 20 Javascript
如何在指定的地方插入html内容和文本内容
Dec 23 Javascript
TypeScript 中接口详解
Jun 19 Javascript
浅析js中substring和substr的方法
Nov 09 Javascript
js当前页面登录注册框,固定div,底层阴影的实例代码
Oct 04 Javascript
jquery判断类型是不是number类型的实例代码
Oct 07 Javascript
简单模拟node.js中require的加载机制
Oct 27 Javascript
微信小程序 免费SSL证书https、TLS版本问题的解决办法
Dec 14 Javascript
Vue项目添加动态浏览器头部title的方法
Jul 11 Javascript
Angular 实现输入框中显示文章标签的实例代码
Nov 07 Javascript
浅谈鸿蒙 JavaScript GUI 技术栈
Sep 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
php设计模式 Singleton(单例模式)
2011/06/26 PHP
PHP入门之常量简介和系统常量
2014/05/12 PHP
php实现的redis缓存类定义与使用方法示例
2017/08/09 PHP
thinkPHP5框架设置404、403等http状态页面的方法
2018/06/05 PHP
跨域表单提交状态的变相判断代码
2009/11/12 Javascript
基于jquery实现的类似百度搜索的输入框自动完成功能
2011/08/23 Javascript
Three.js源码阅读笔记(光照部分)
2012/12/27 Javascript
Extjs优化(一)删除冗余代码提高运行速度
2013/04/15 Javascript
bootstrap网格系统使用方法解析
2017/01/13 Javascript
JS中input表单隐藏域及其使用方法
2017/02/13 Javascript
AngularJS 限定$scope的范围实例详解
2017/06/23 Javascript
vue中遇到的坑之变化检测问题(数组相关)
2017/10/13 Javascript
Vue项目中使用better-scroll实现一个轮播图自动播放功能
2018/12/03 Javascript
JavaScript设计模式之命令模式实例分析
2019/01/16 Javascript
nodejs微信开发之授权登录+获取用户信息
2019/03/17 NodeJs
package.json各个属性说明详解
2020/03/11 Javascript
Python入门篇之面向对象
2014/10/20 Python
Python编程实现控制cmd命令行显示颜色的方法示例
2017/08/14 Python
python实现聚类算法原理
2018/02/12 Python
python socket网络编程之粘包问题详解
2018/04/28 Python
python-docx修改已存在的Word文档的表格的字体格式方法
2018/05/08 Python
使用IDLE的Python shell窗口实例详解
2019/11/19 Python
详解Python 重学requests发起请求的基本方式
2020/02/07 Python
python中not、and和or的优先级与详细用法介绍
2020/11/03 Python
HTML5在IE10、火狐下中文乱码问题的解决方法
2013/11/18 HTML / CSS
爱国口号
2014/06/19 职场文书
基层干部群众路线教育实践活动个人对照检查材料
2014/09/23 职场文书
2014年安全工作总结范文
2014/11/13 职场文书
2015年度残疾人工作总结
2015/05/14 职场文书
贫民窟的百万富翁观后感
2015/06/09 职场文书
2015中学政教处工作总结
2015/07/22 职场文书
CSS实现章节添加自增序号的方法
2021/06/23 HTML / CSS
TV动画「神渣☆爱豆」公开第一弹主视觉图
2022/03/21 日漫
把77A收信机改造成收音机
2022/04/05 无线电
带你了解Java中的ForkJoin
2022/04/28 Java/Android
使用CSS定位HTML元素的实现方法
2022/07/07 HTML / CSS