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 相关文章推荐
在JavaScript中,为什么要尽可能使用局部变量?
Apr 06 Javascript
由JavaScript中call()方法引发的对面向对象继承机制call的思考
Sep 12 Javascript
js+html5实现可在手机上玩的拼图游戏
Jul 17 Javascript
javascript简单实现类似QQ头像弹出效果的方法
Aug 03 Javascript
基于jQuery ligerUI实现分页样式
Sep 18 Javascript
Linux CentOS系统下安装node.js与express的方法
Apr 01 Javascript
全面解析jQuery中的$(window)与$(document)的用法区别
Aug 15 jQuery
Vue.js划分组件的方法
Oct 29 Javascript
vue中引用swiper轮播插件的教程详解
Aug 16 Javascript
vuejs 动态添加input框的实例讲解
Aug 24 Javascript
vue表单自定义校验规则介绍
Aug 28 Javascript
深入理解es6块级作用域的使用
Mar 28 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
url decode problem 解决方法
2011/12/26 PHP
通过php修改xml文档内容的方法
2015/01/23 PHP
PHP简单读取xml文件的方法示例
2017/04/20 PHP
PHP生成(支持多模板)二维码海报代码
2018/04/30 PHP
js打印纸函数代码(递归)
2010/06/18 Javascript
JavaScript不刷新实现浏览器的前进后退功能
2014/11/05 Javascript
Javascript设计模式之观察者模式的多个实现版本实例
2015/03/03 Javascript
js控制网页前进和后退的方法
2015/06/08 Javascript
JS代码随机生成姓名、手机号、身份证号、银行卡号
2016/04/27 Javascript
Ext JS 实现建议词模糊动态搜索功能
2017/05/13 Javascript
原生JavaScript实现Ajax异步请求
2017/11/19 Javascript
JS计算距当前时间的时间差实例
2017/12/29 Javascript
微信小程序日历效果
2018/12/29 Javascript
玩转Koa之核心原理分析
2018/12/29 Javascript
layui-table对返回的数据进行转变显示的实例
2019/09/04 Javascript
python进阶教程之循环相关函数range、enumerate、zip
2014/08/30 Python
Python and、or以及and-or语法总结
2015/04/14 Python
Python中unittest模块做UT(单元测试)使用实例
2015/06/12 Python
Python实现希尔排序算法的原理与用法实例分析
2017/11/23 Python
详解python实现识别手写MNIST数字集的程序
2018/08/03 Python
利用pyinstaller打包exe文件的基本教程
2019/05/02 Python
Python3 实现爬取网站下所有URL方式
2020/01/16 Python
python MD5加密的示例
2020/10/19 Python
IE兼容css3圆角的实现代码
2011/07/21 HTML / CSS
eBay法国购物网站:eBay.fr
2017/10/21 全球购物
波兰品牌鞋履在线商店:Eastend.pl
2020/01/11 全球购物
工作失误检讨书范文大全
2014/01/13 职场文书
教师理论学习心得体会
2016/01/21 职场文书
创业计划书之校园超市
2019/09/12 职场文书
解决Golang time.Parse和time.Format的时区问题
2021/04/29 Golang
MySQL 8.0 Online DDL快速加列的相关总结
2021/06/02 MySQL
Python-OpenCV教程之图像的位运算详解
2021/06/21 Python
详解nginx location指令
2022/01/18 Servers
vue 自定义的组件绑定点击事件
2022/04/21 Vue.js
Redis基本数据类型Zset有序集合常用操作
2022/06/01 Redis