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

 更新时间:2019年09月23日 15:01:23   作者:云溪111  
今天小编就为大家分享一篇layer ui 导入文件之前传入数据的实例,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧

最近用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 导入文件之前传入数据的实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。

相关文章

  • js实现四舍五入完全保留两位小数的方法

    js实现四舍五入完全保留两位小数的方法

    这篇文章主要介绍了js实现四舍五入完全保留两位小数的方法,涉及javascript针对浮点数的数值运算相关技巧,需要的朋友可以参考下
    2016-08-08
  • JavaScript两种计时器的实例讲解

    JavaScript两种计时器的实例讲解

    今天小编就为大家分享一篇关于JavaScript两种计时器的实例讲解,小编觉得内容挺不错的,现在分享给大家,具有很好的参考价值,需要的朋友一起跟随小编来看看吧
    2019-01-01
  • uniapp禁止遮罩层下页面滚动的解决方法

    uniapp禁止遮罩层下页面滚动的解决方法

    在uniapp的开发中用过弹窗的都知道有个bug就是滑动弹窗的内容底部页面也会跟着滑动,所以这篇文章主要给大家介绍了关于uniapp禁止遮罩层下页面滚动的解决方法,需要的朋友可以参考下
    2023-09-09
  • 关闭浏览器时提示onbeforeunload事件

    关闭浏览器时提示onbeforeunload事件

    这篇文章主要介绍了关闭浏览器时提示onbeforeunload事件,有需要的朋友可以参考一下
    2013-12-12
  • JS实现的随机排序功能算法示例

    JS实现的随机排序功能算法示例

    这篇文章主要介绍了JS实现的随机排序功能算法,结合具体实例形式分析了javascript常用的排序算法实现技巧,需要的朋友可以参考下
    2017-06-06
  • 多个js毫秒倒计时同时进行效果

    多个js毫秒倒计时同时进行效果

    这篇文章主要以实例的方式讲解多个js毫秒倒计时同时进行效果,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2016-01-01
  • mpvue微信小程序的接口请求fly全局拦截代码实例

    mpvue微信小程序的接口请求fly全局拦截代码实例

    这篇文章主要介绍了mpvue微信小程序的接口请求fly全局拦截代码实例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
    2019-11-11
  • Validform表单验证总结篇

    Validform表单验证总结篇

    这篇文章主要介绍了Validform表单验证,包括通用表单验证方法的知识,本文给大家介绍的非常详细具有参考借鉴价值,需要的朋友可以参考下
    2016-10-10
  • 多浏览器支持的右下角浮动窗口

    多浏览器支持的右下角浮动窗口

    支持各种浏览器的右下角浮动窗口,需要的朋友可以参考下。
    2010-04-04
  • ES6学习教程之Promise用法详解

    ES6学习教程之Promise用法详解

    这篇文章主要给大家介绍了关于ES6学习教程之Promise用法的相关资料,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2020-11-11

最新评论