layui上传文件时显示正在加载

 一,声明全局变量

var loadingIndex;

二, 在上传按钮点击事件中添加

//在上传按钮点击事件中添加
loadingIndex = layer.load(1, {
        shade: [0.5,'#000'] //0.1透明度的背景
    });

三,在上传成功后的回调函数中关闭加载项

 done: function (res) {
                    layer.close(loadingIndex);
                } 

 

  • 0
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
asp.net mvc 通用权限管理系统(响应布局)源码是基于asp.net(C#)MVC+前端bootstrap+ztree+lodash+jquery技术,采用bootstrap为前台开发展示UI,Web Api主要负责前端的逻辑交互,再结合jQuery Ajax+Web Api进行提交数据请求。 框架特色: 1、为了数据方便读写,语言的成熟性,选择asp.net开发效率更高效率更快; 2、系统架构采用:耦合性低、重用性高、部署快、可维护性高等优点的MVC框架进行搭建; 3、系统配置文件数据采用HttpRuntime.Cache进行缓存,使得程序在运行中效率更高、速度更快; 4、数据库的选型,根据系统的数据规模与需求方的相关要求,综合多方考量,调研多种数据库后选定mysql为系统数据库; 5、运行环境根据功能模块的特点,选型window server2008+IIS,部署更简洁; 6、使用报表导出开源组件NPOI可以在没有安装Office的情况下对Word或Excel文档进行读写操作; 7、为了兼容更多的浏览器,让用户界面使用更友好。我们选择了响应式布局框架bootstrap; 8、系统报表我们采用了echarts开源软件,并且我们提供了非常炫酷的图形界面,特色是地图,另外还提供了柱状图、折线图、饼图、气泡图及四象限图等; 9、系统采用bootstrap响应式布局,这样面对不同分辨率设备灵活性强能够快捷解决多设备显示适应问题; 10、系统基于ASP.NET(C#) MVC +web api+Bootstrap +Jquery+ MYSQL前端采用响应式布局对页面兼容性显著提高; 系统优势: 代码可以满足大部分开发者的需求,让开发人员能省不少间 ASP.NET MVC通用角色权限管理系统源码 更新日志: 2020-03-23 更新如下: 1、新增文件上传功能实例,保证文件能够无误上传保存并下载; 2、优化后台系统框架代码,删除以前大项目其它无用功能; 3、新增页面代码JS、css文件的压缩,使得系统运行速度更快; 4、系统登录页面新增验证校验过程,这样做到输入验证码验证; 5、优化系统加载页面提示数据加载功能。
Layui 中,你可以使用 `upload` 组件来实现文件上传按钮。以下是一个基本的示例代码: ```html <input type="file" name="file" id="uploadBtn"> ``` ```javascript layui.use('upload', function() { var upload = layui.upload; // 选择文件后的回调函数 upload.render({ elem: '#uploadBtn', // 绑定上传按钮的选择器 url: '/upload', // 上传接口的 URL done: function(res) { // 上传成功的回调函数 console.log(res); // 文件上传成功后的操作 }, error: function() { // 上传失败的回调函数 // 文件上传失败后的操作 } }); }); ``` 在上述代码中,我们首先在 HTML 中创建了一个文件上传按钮,其 ID 设置为 `uploadBtn`。然后,在 JavaScript 中,我们使用 `layui.use('upload', ...)` 来加载 Layui 的 `upload` 组件,并使用 `upload.render()` 方法将上传按钮与上传接口进行绑定。 在 `upload.render()` 的配置中,我们指定了上传按钮的选择器(`elem`),上传接口的 URL(`url`),以及上传成功和失败的回调函数(`done` 和 `error`)。你可以根据实际需要修改这些配置。 当用户选择文件后,点击上传按钮,会触发相应的回调函数。在示例代码中,我们简单地在控制台输出了上传成功的响应结果(`res`)。 请注意,为了使文件上传正常工作,你需要确保在页面中正确加载Layui 的相关资源和样式文件。 希望这对你有所帮助!如果有任何进一步的问题,请随提问。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值