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     }

 

posted @ 2020-05-12 15:39  Easy友  阅读(5816)  评论(0编辑  收藏  举报