<div style="width: 500px; margin: 0 auto;">
<div class="panel panel-primary">
<div class="panel-heading">
<h3 class="panel-title">文件上传</h3>
</div>
<div class="container">
<div class="panel-body">
<div id="tishi">
</div>
<form class="form-horizontal" id="formbiao">
<div class="form-group">
<div class="input-group">
<span class="input-group-addon">文件一</span>
<input type="file" class="form-control" id="picture1" />
</div>
</div>
<div class="form-group">
<div class="col-lg-4"></div>
<button type="button" class="btn btn-primary" οnclick="fileUpload()">上传</button>
<button type="reset" class="btn btn-primary" οnclick="formReset()">重置</button>
</div>
</form>
<div class="progress">
<div id="progress-bar" class="progress-bar progress-bar-success progress-bar-striped" role="progressbar"
aria-valuenow="40" aria-valuemin="0" aria-valuemax="100" style="width: 0%">
<span class="sr-only">40% Complete (success)</span>
</div>
</div>
</div>
</div>
</div>
</div>
public string PictureUploadDo(HttpPostedFileBase picture1, HttpPostedFileBase picture2, HttpPostedFileBase picture3)
{
string path = "/Upload/";
try
{
//非空判断
if (picture1 == null || picture2 == null || picture3 == null)
{
return "图片选择不能为空!";
}
else
{
string Extlist = ".BMP.GIF.JPEG.JPG.PNG.bmp.gif.jpeg.png.jpg";
string ext1 = Path.GetExtension(picture1.FileName);
string ext2 = Path.GetExtension(picture2.FileName);
string ext3 = Path.GetExtension(picture3.FileName);
if (Extlist.IndexOf(ext1) == -1 || Extlist.IndexOf(ext2) == -1 || Extlist.IndexOf(ext3) == -1)
{
return "有非图片格式的文件";
}
else
{
//新名称
string newName1 = Guid.NewGuid() + ext1;
string newName2 = Guid.NewGuid() + ext2;
string newName3 = Guid.NewGuid() + ext3;
//新后缀
string newpath1 = Path.Combine(path, newName1);
string newpath2 = Path.Combine(path, newName2);
string newpath3 = Path.Combine(path, newName3);
//上传
picture1.SaveAs(Server.MapPath(newpath1));
picture2.SaveAs(Server.MapPath(newpath2));
picture3.SaveAs(Server.MapPath(newpath3));
return "上传完成";
}
}
}
catch (Exception e)
{
return e.Message;
}
}
<script>
function formReset() {
document.getElementById("formbiao").reset();
$("#progress-bar").attr("style", "width:0%");
$("#tishi").empty();
}
function fileUpload() {
var formdata = new FormData;
formdata.append("picture1", document.getElementById("picture1").files[0]);
formdata.append("picture2", document.getElementById("picture2").files[0]);
formdata.append("picture3", document.getElementById("picture3").files[0]);
$.ajax({
url: "/PictureManage/PictureUploadDo",
type: "Post",
data: formdata,
cache: false,
processData: false,
contentType: false,
success: function (data, status, xhr) {
$("#progress-bar").attr("style", "width:30%");
$("#progress-bar").attr("style", "width:60%");
$("#progress-bar").attr("style", "width:100%");
$("#tishi").empty();
if (status == "success")
{
$("#tishi").append("<div class='alert alert-danger'><a href='#' class='close' data-dismiss='alert'>×</a><strong>"+data+"</strong></div>");
}
},
error: function(data, status, xhr) {
alert(xhr);
}
});
}
</script>
public ActionResult AddPro1(FileInfoModel pro, HttpPostedFileBase files)
{
if (files != null)
{
var fileName = Path.Combine(Request.MapPath("~/UploadFiles"), Path.GetFileName(files.FileName));
files.SaveAs(fileName);
return Content("<script>alert('保存成功'); </script>");
//pro.AttachmentPath = fileName;//得到全部model信息
//pro.FilePath = "../UploadFiles/" + Path.GetFileName(files.FileName);
//pro.FileName = Path.GetFileName(files.FileName);
//pro.FileType = Request["FileType"].ToString();
//if (bll.FileAdd(pro) > 0)
//{
// return Content("<script>alert('提交成功'); </script>");
//}
//else
//{
// return Content("<script>alert('提交失败'); </script>");
//}
}
else
{
return Content("<script>alert('请选择文件'); </script>");
}
}
<div style="margin:0 auto;width:200px; height:300px;">
<form action="/Test/AddPro1" enctype="multipart/form-data" method="post"> <select id="Select1" name="FileType">
<option value="图片">图片</option>
<option value="视频">视频</option>
<option value="音乐">音乐</option>
<option value="文本">文本</option>
</select>
<span>上传文件</span>
<br />
<input type="file" name="files" class="btn btn-default" />
<br />
<br />
<input id="ButtonUpload" type="submit" class="btn-success" style=" width:100px; height:auto" value="上传" />
</form>
</div>
BootStrap 常用提示
$("#progress-bar").attr("style", "width:100%");
$("#tishi").append("<div class='alert alert-danger'><a href='#' class='close' data-dismiss='alert'>×</a><strong>" + data + "</strong></div>");