这篇文章给大家分享的是有关如何实现js上传文件功能的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。
具体内容如下
一、用input完成上传,效果图如
选择文件后,提交后出现图片url
二、传输格式采用form-data形式。
html代码
<form id="upload" enctype="multipart/form-data" method="post">
<input type="file" name="file" id="pic"/>
<input type="button" value="提交" onclick="uploadPic();"/>
<span class="showUrl"></span>
<img src="" class="showPic" alt="">
</form>
js部分
function uploadPic() {
var form = document.getElementById('upload'),
formData = new FormData(form);
$.ajax({
url:"https://sscpre.boe.com/v1/medical-console/medical/file/upload",
type:"post",
data:formData,
processData:false,
contentType:false,
success:function(res){
if(res){
alert("上传成功!");
}
console.log(res);
$("#pic").val("");
$(".showUrl").html(res);
$(".showPic").attr("src",res);
},
error:function(err){
alert("网络连接失败,稍后重试",err);
}
})
}
感谢各位的阅读!关于“如何实现js上传文件功能”这篇文章就分享到这里了,希望以上内容可以对大家有一定的帮助,让大家可以学到更多知识,如果觉得文章不错,可以把它分享出去让更多的人看到吧!
亿速云「云服务器」,即开即用、新一代英特尔至强铂金CPU、三副本存储NVMe SSD云盘,价格低至29元/月。点击查看>>
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。