layui上传文件choose只触发一次的解决方法
环境:.net core + layui
场景:上传文件的时候需要先弹出一个层选择对应的条件传到上传方法里面做逻辑,发现layui.upload上传一次之后在不刷新页面的前提下不会执行choose方法了;
问题原理:个人理解是upload.render方法执行一次之后,第二次之后没有把elem指定的这个元素对象重新生成,而是有选择性的更新对象的属性,比如file就应该没更新,还是上一次的file导致change方法没触发;
解决方法:
最简单的就是把elem指定的这个元素变成动态添加,而不是先在页面写死;
示例:
1 //初始化上传控件
2 var InitUpload = function () {
3 //submitbtngroup 这个是上传按钮的父节点 动态添加上传按钮 解决上传一次之后choose方法不执行的bug
4 $("#submitbtngroup").append('<button class="layui-btn layui-btn-normal" lay-submit lay-filter="chooseFile" id="chooseFile">上传文件</button>');
5 //导入数据按钮事件
6 var uploadInst = upload.render({ //允许上传的文件后缀
7 elem: '#chooseFile'
8 , url: '/xxxx/xxxx'
9 , accept: 'file' //普通文件
10 , exts: 'xlsx|xls' //只允许上传excel文件
11 , done: function (res) {
12
13 //每次执行之后都删除上传按钮 在前面重新加
14 $("#chooseFile").remove();
15 }
16 });
17 }
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· AI与.NET技术实操系列:基于图像分类模型对图像进行分类
· go语言实现终端里的倒计时
· 如何编写易于单元测试的代码
· 10年+ .NET Coder 心语,封装的思维:从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热?
· 分享一个免费、快速、无限量使用的满血 DeepSeek R1 模型,支持深度思考和联网搜索!
· 基于 Docker 搭建 FRP 内网穿透开源项目(很简单哒)
· ollama系列01:轻松3步本地部署deepseek,普通电脑可用
· 25岁的心里话
· 按钮权限的设计及实现