js实现上传文件功能 简单实现js上传文件功能
静乐想 人气:0想了解简单实现js上传文件功能的相关内容吗，静乐想在本文为您仔细讲解js实现上传文件功能的相关知识和一些Code实例，欢迎阅读和指正，我们先划重点：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);
}
})
}
加载全部内容