MVC Ajax上传文件

前台：首先要导入jQuery

<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Index</title>
<script src="~/scripts/jquery-3.2.1.js"></script>
<script type="text/javascript">
function SubFile() {
var fileUpload = $("#fupload").get(0);
var files = fileUpload.files;
var data = new FormData();
for (var i = 0; i < files.length; i++) {
data.append(files[i].name, files[i]);
}
var baseUrl = "/Default/UploadFile" + "?r=" + Math.random();
$.ajax({
url: baseUrl,
type: "POST",
data: data,
contentType: false,
processData: false,
success: function (result) {
alert(result);
},
error: function (err) {
alert("出现错误：" + err.statusText)
}
});
}

function UpSubFile() {
$("#fupload").click();
}
</script>
</head>
<body>
<div>
单文件上传：
<input type="file" id="fupload" style="display:none" onchange="SubFile()" />
<input type="button" value="上传" onclick="UpSubFile()" />

多文件上传：
<input type="file" multiple id="fuploadMult" onchange="SubFile()" />

</div>
</body>
</html>

后台：

[HttpPost]
public string UploadFile()
{
try
{
HttpFileCollection files = System.Web.HttpContext.Current.Request.Files;
foreach (string item in files)
{
HttpPostedFile file = files[item];
var fileName = Path.GetFileName(file.FileName);
var filePath = "/Content/UploadFile";

string newFileName = Guid.NewGuid().ToString() + fileName;

file.SaveAs(Server.MapPath(Path.Combine(filePath, newFileName)));
}

return "OK";
}
catch (Exception ex)
{
return ex.Message;
}
}

巴特西

MVC Ajax上传文件

最新文章

热门文章