多个附件上传能在前端删除和新增的步骤。

最新推荐文章于 2022-12-09 14:28:23 发布

Wtg_wutiegang

最新推荐文章于 2022-12-09 14:28:23 发布

阅读量1.4k

点赞数 1

分类专栏：多文件编辑的思路我的笔记本文章标签：附件上传

本文链接：https://blog.csdn.net/Wtg_wutiegang/article/details/100083627

版权

本文介绍如何在前端实现多附件上传功能，包括在change事件中即时上传附件到服务器，以及如何在页面上进行附件的删除和新增操作。通过在file输入框设置multiple属性，可以支持选择多个文件。新增操作主要涉及创建表单，存储file对象数组，使用ajax以POST方式提交数据，后端则负责接收并处理这些上传请求。

摘要由CSDN通过智能技术生成

附件上传最好在change事件的时候就将附件上传至服务器，然后将对应的附件参数返回给页面实现数据新增。

多附件上传首先在file标签里面加上multiple属性，例如：<input type="file" id="uploadFile" name="uploadFile" multiple style="margin-top:3px;width: 65px;height: 20px;display: inline-block"/>

新增操作的步骤：第一种方法

1，创建一个表单

var FormData =new FormData();

var arr=[];

2，将file对象放入数组中

$("#uploadFile").change(function () {
    var fileList=this.files;
    for(var i=0;i<fileList.length;i++){
        $(this).after("<span id='file_id_"+i+"'>"+fileList[i].name+"<a href='#' class='easyui-linkbutton' iconCls='i