首页 > 编程知识 正文

html5拖拽文件上传(html页面上传文件)

时间:2023-05-03 16:32:34 阅读:69271 作者:562

1 .通过本机js实现文件上传

html部分:

上传文件

js部分:

上传(事件)//而不是执行上传功能

let it=event.target;

$(it ).next ) ).click );

(,

上传UploadFile ()//文件

let msg=new FormData (;

MSG.append('file ',$ ) ' #uploadbillsinp ' ) )0).files(0);

MSG.append(enctype,) multipart/form-data );

this.$post (接口地址)、msg、{

headers : { ' content-type ' : ' multipart/form-data ' },

fileType: 'text '

}.Then(data={

控制台. log (data )

); (,

2 .通过2.elementUI实现文件上传

上传

导出默认值{

数据()。

返回{

文件列表: [ ],

}

(,

methods:{

上传uploadfile(content )//文件

let msg=new FormData (;

MSG.append('file ',content.file );

MSG.append(enctype,) multipart/form-data );

this.$post (接口地址)、msg、{

headers : { ' content-type ' : ' multipart/form-data ' },

fileType: 'text' //上传文件类型设置

}.Then(data={

控制台. log (数据;

}

);

(,

}

}

3 .文件上传类型的正规验证

if (! //() png|jpg ) $/.test ) (text ) }

//文件上传类型不是. png和. jpg时所需的操作

返回假;

}

4 .如果反复上传相同的图像,上传就会失败。 必须清除值

$('#uploadBillsInp ' ).val (' );

版权声明:该文观点仅代表作者本人。处理文章:请发送邮件至 三1五14八八95#扣扣.com 举报,一经查实,本站将立刻删除。