http://www.uploadify.com/download/ 可以下载最新的uploadify插件,最新的版本为3.2.1
uploadify中可提前判断文件的大小,也能检测文件类型,解决了纯js在ie8下除非用ActiveXObject才能获取文件的大小的问题
var fileobject = new ActiveXObject("Scripting.FileSystemObject"); //获取上传文件的对象
var file = fileobject.GetFile(filePath); //获取上传的文件
var filerealSize = file.Size;
ActiveXObject每次都需要用户点击是否允许不安全的应用之类的,对用户不够友好。Firefox可以直接取到文件的filesize大小,为了兼容都采用flash方法
html头中加入相关的的css和js文件
<link href="../../themes/base/jquery-ui.css" rel="stylesheet" type="text/css" />
<link href="../../themes/base/jquery.ui.dialog.css" rel="stylesheet" type="text/css" />
<link href="../../Scripts/uploadify-v3.2.1/uploadify.css" rel="stylesheet" type="text/css" />
<script src="../../Scripts/jquery-1.7.1.min.js" type="text/javascript"></script>
<script src="../../Scripts/jquery-ui-1.8.20.js" type="text/javascript"></script>
<script src="../../Scripts/uploadify-v3.2.1/jquery.uploadify.js" type="text/javascript"></script>
html描述:
<div>
<input type="button" id="UploadBtn" value="上传文件" name="UploadBtn" οnclick="UploadFunc()"/>
</div>
<div id="DialogID" style="display:none">
<input type="file" id="file_upload" name="file_upload" />
</div>
js代码:
<script type="text/javascript">
function UploadFunc() {
$('#file_upload').uploadify({
'buttonText': '选择上传文件',
'swf': '@Url.Content("~/Scripts/uploadify-v3.2.1/uploadify.swf")',
'uploader': '/Home/Upload',
'removeCompleted': true,
'checkExisting': true,
'fileTypeDesc': 'PDF文件',
'fileTypeExts': '*.pdf',
'fileSizeLimit': '30MB',
'auto': true,
'onQueueComplete': function () {
$('#file_upload').uploadify('destroy'); //此处必须要将flash的对象destroy,否则再次打开对话框时会报错
$("#DialogID").dialog('close');
}
});
$("#DialogID").dialog({
height: 300,
width: 500,
title: "上传文件",
modal: true,
resizable: false
});
}
</script>
其中使用uploadify的参数就不再进行详述,其中参数'swf','uploader'是必须的,若要指定uploadify的具体样式,需要修改uploadify.css文件
若要修改uploadify报错语言为中文,修改jquery.uploadify.js中的英文报错信息
其中Controller中代码如下:
[AcceptVerbs(HttpVerbs.Post)]
public JsonResult Upload(HttpPostedFileBase fileData)
{
if (fileData != null)
{
try
{
// 文件上传后的保存路径
string filePath = Server.MapPath("~/Uploads/");
if (!Directory.Exists(filePath))
{
Directory.CreateDirectory(filePath);
}
string fileName = Path.GetFileName(fileData.FileName);
fileData.SaveAs(filePath + fileName);
return Json(new { Success = true, FileName = fileName, SaveName = saveName });
}
catch (Exception ex)
{
return Json(new { Success = false, Message = ex.Message }, JsonRequestBehavior.AllowGet);
}
}
else
{
return Json(new { Success = false, Message = "没有选择上传文件!" }, JsonRequestBehavior.AllowGet);
}
}
附件地址:点击打开链接