ASP.NET MVC4 利用uploadify.js多文件上传
更新时间：2021年9月22日 10:04 点击：1994
页面代码：
1.引入js和css文件
<link href="~/Scripts/uploadify/uploadify.css" rel="external nofollow" rel="stylesheet" />
<style type="text/css">
#upDiv {
width: 550px;
height: 400px;
border: 2px solid red;
margin-top: 30px;
margin-left: 50px;
float: left;
}
div form {
text-align: center;
vertical-align: middle;
}
h2, h3 {
text-align: center;
color: #00B2EE;
}
#upList {
width: 900px;
height: 400px;
float: left;
margin-top: 30px;
margin-left: 50px;
overflow-y: scroll;
border: 2px solid red;
}
#filelist {
width: 45%;
height: 400px;
float: left;
}
#lineDiv {
width: 50px;
height: 400px;
float: left;
}
#imglist {
width: 45%;
height: 400px;
float: left;
}
#form1 {
margin-top: 25px;
}
img {
width: 25px;
height: 25px;
}
.btn {
width: 150px;
height: 40px;
text-align: center;
background-color: #b58061;
color: white;
}
p {
cursor: pointer;
}
</style>
<script src="~/Scripts/jquery-1.8.2.min.js"></script>
<script src="~/Scripts/uploadify/jquery.uploadify-3.1.js"></script>
<script type="text/javascript">
$(function () {
$("#myfile").uploadify({
"auto": false,
"swf": "../Scripts/uploadify/uploadify.swf",
"uploader": "../Home/UploadFiles",
"removeCompleted": false,
"onUploadSuccess": function (file, data, response) {
},
"onQueueComplete": function () {
window.location.reload();
}
});
$.ajax({
url: "/home/loadFileInfo",
datatype: 'html',
success: function (result) {
$('#filelist').append(result);
}
});
$.ajax({
url: "/home/loadImgInfo",
datatype: 'html',
success: function (result) {
$('#imglist').append(result);
}
});
});
//在线打开文件
function openFile(doc) {
try {
var fileName = $(doc).text();
var url = window.location.protocol + "//" + window.location.host + "/UploadFile/File/"
url = url + fileName;
window.open(url);
} catch (EventException) {
alert("此文件无法打开！");
}
}
//在线打开图片
function openImg(doc) {
var fileName = $(doc).text();
var url = window.location.protocol + "//" + window.location.host + "/UploadImg/Img/"
url = url + fileName;
window.open(url);
}
</script>
2.body内代码
<body style="background: url(../../Images/bg.jpg) no-repeat; background-size: 1600px; width: 1600px; height: 700px; ">
<h2 style="text-align:center;">ASP .NET MVC4 多文件文件上传实例</h2>
<form id="form1">
<div>
<input type="file" id="myfile" name="myfile" />
</div>
<div>
<a class="btn" href="javascript:$('#myfile').uploadify('upload');" rel="external nofollow" >上传第一个</a>
<a class="btn" href="javascript:$('#myfile').uploadify('upload','*');" rel="external nofollow" >上传队列</a>
<a class="btn" href="javascript:$('#myfile').uploadify('cancel');" rel="external nofollow" >取消第一个</a>
<a class="btn" href="javascript:$('#myfile').uploadify('cancel', '*');" rel="external nofollow" >取消队列</a>
</div>
</form>
<div id="upList">
<div id="filelist">
<h3>文件列表</h3>
</div>
<div id="lineDiv"></div>
<div id="imglist">
<h3>图片列表</h3>
</div>
</div>
</body>
后台代码：
public ActionResult loadFileInfo()
{
StringBuilder sb = new StringBuilder();
DirectoryInfo theFolder = new DirectoryInfo(Server.MapPath("~/UploadFile/"));
DirectoryInfo[] dirInfo = theFolder.GetDirectories();
//遍历文件夹
foreach (DirectoryInfo NextFolder in dirInfo)
{
FileInfo[] fileInfo = NextFolder.GetFiles();
//遍历文件
foreach (FileInfo NextFile in fileInfo)
{
string exStr = NextFile.Extension;
string str = NextFile.Name;
if (exStr == ".zip" || exStr == ".7z" || exStr == ".rar" || exStr.ToLower() == ".rars")
{
sb.Append("<p onclick='openFile(this)'><img src='../../Images/zip.png' width='25' height='25' />" + str + "</p>");
}
else if (exStr == ".doc" || exStr == ".docx")
{
sb.Append("<p onclick='openFile(this)'><img src='../../Images/words.png' width='25' height='25' />" + str + "</p>");
}
else if (exStr == ".ppt" || exStr == ".pptx")
{
sb.Append("<p onclick='openFile(this)'><img src='../../Images/ppt.jpg' width='25' height='25' />" + str + "</p>");
}
else if (exStr == ".xlsx" || exStr == ".xls" || exStr == ".XLS")
{
sb.Append("<p onclick='openFile(this)'><img src='../../Images/excel.png' width='25' height='25' />" + str + "</p>");
}
else if (exStr == ".pdf")
{
sb.Append("<p onclick='openFile(this)'><img src='../../Images/pdf.jpg' width='25' height='25' />" + str + "</p>");
}
else if (exStr == ".js" || exStr == ".JS")
{
sb.Append("<p onclick='openFile(this)'><img src='../../Images/js.png' width='25' height='25' />" + str + "</p>");
}
else if (exStr == ".html" || exStr == ".HTML")
{
sb.Append("<p onclick='openFile(this)'><img src='../../Images/html.png' width='25' height='25' />" + str + "</p>");
}
else if (exStr == ".txt" || exStr == ".TXT")
{
sb.Append("<p onclick='openFile(this)'><img src='../../Images/txt.png' width='25' height='25' />" + str + "</p>");
}
else if (exStr == ".mp3" || exStr == ".wmv" || exStr == ".aac")
{
sb.Append("<p onclick='openFile(this)'><img src='../../Images/mp3.png' width='25' height='25' />" + str + "</p>");
}
else if (exStr == ".avi" || exStr == ".mov" || exStr == ".mp4" || exStr == ".ram" || exStr == ".flv")
{
sb.Append("<p onclick='openFile(this)'><img src='../../Images/video.png' width='25' height='25' />" + str + "</p>");
}
else {
sb.Append("<p onclick='openFile(this)'><img src='../../Images/file.jpg' width='25' height='25' />" + str + "</p>");
}
}
}
return Content(sb.ToString());
}
public ActionResult loadImgInfo()
{
StringBuilder sb = new StringBuilder();
DirectoryInfo theFolder = new DirectoryInfo(Server.MapPath("~/UploadImg/"));
DirectoryInfo[] dirInfo = theFolder.GetDirectories();
//遍历文件夹
foreach (DirectoryInfo NextFolder in dirInfo)
{
FileInfo[] fileInfo = NextFolder.GetFiles();
//遍历文件
foreach (FileInfo NextFile in fileInfo)
{
string str = NextFile.Name;
sb.Append("<p onclick='openImg(this)'><img src='../../Images/img.png' width='25' height='25' />" + str + "</p>");
}
}
return Content(sb.ToString());
}
public ActionResult UploadFile()
{
string filepath = "";
bool fileOK = false;
//判断是否已经选择上传文件
HttpPostedFileBase file = Request.Files["myfile"];
if (file != null && file.ContentLength > 0)
{
String fileExtension = System.IO.Path.GetExtension(file.FileName).ToLower();
//判断是否为图片类型
String[] allowedExtensions = { ".gif", ".png", ".bmp", ".jpg" };
for (int i = 0; i < allowedExtensions.Length; i++)
{
if (fileExtension == allowedExtensions[i])
{
fileOK = true;
}
}
if (fileOK)
{
//设置上传目录
string path = Server.MapPath("~/UploadImg/Img/");
if (!Directory.Exists(path))
Directory.CreateDirectory(path);
string filenNamer = file.FileName;
//文件路径
filepath = path + filenNamer;
file.SaveAs(filepath);
return RedirectToAction("Upload", "Home");
}
else
{
//设置上传目录
string path = Server.MapPath("~/UploadFile/File/");
if (!Directory.Exists(path))
Directory.CreateDirectory(path);
//不为图片类型的文件存入到File目录中
string filenNamer = file.FileName;
//文件路径
filepath = path + filenNamer;
file.SaveAs(filepath);
return RedirectToAction("Upload", "Home");
}
}
else
{
var script = String.Format("<script>alert('请选择文件后再上传！');location.href='{0}'</script>", Url.Action("Upload"));
return Content(script, "text/html");
}
}
以上就是本文的全部内容，希望本文的内容对大家的学习或者工作能带来一定的帮助，同时也希望多多支持猪先飞！
相关文章
- 这篇文章主要为大家详细介绍了ASP.NET购物车的实现过程，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下...2021-09-22
- 在开发过程中，使用Visual Studio的断点调试功能可以很方便帮我们调试发现程序存在的错误，同样Visual Studio也支持对SQL Server里面的存储过程进行调试，下面就让我们看看具体的调试方法。...2021-09-22
- 本文章来人大家介绍一个php文件上传类的使用方法，期望此实例对各位php入门者会有不小帮助哦。 简介 Class.upload.php是用于管理上传文件的php文件上传类， 它可以帮...2016-11-25
- 这篇文章主要为大家详细介绍了js实现上传图片及时预览的相关资料，具有一定的参考价值，感兴趣的朋友可以参考一下...2016-05-09
- 又码了一个周末的代码，这次在做一些关于文件上传的东西。（PHP UPLOAD）小有收获项目是一个BT种子列表，用户有权限上传自己的种子，然后配合BT TRACK服务器把种子的信息写出来...2016-11-25
- 本文实例讲述了jQuery实现文件上传进度条效果的代码。分享给大家供大家参考。具体如下： 运行效果截图如下：具体代码如下：<!DOCTYPE html><html><head><meta charset="utf-8"><title>upload</title><link rel="stylesheet...2015-11-24
- 本篇文章主要说明的是与php文件上传的相关配置的知识点。PHP文件上传功能配置主要涉及php.ini配置文件中的upload_tmp_dir、upload_max_filesize、post_max_size等选项，下面一一说明。打开php.ini配置文件找到File Upl...2015-10-21
- EXCEL数据上传到SQL SERVER中的方法需要注意到三点!注意点一:要把EXCEL数据上传到SQL SERVER中必须提前把EXCEL传到服务器上.做法: 在ASP.NET环境中,添加一个FileUpload上传控件后台代码的E.X: 复制代码 代码如下: if...2013-09-23
- DVWA (Dam Vulnerable Web Application)DVWA是用PHP+Mysql编写的一套用于常规WEB漏洞教学和检测的WEB脆弱性测试程序。包含了SQL注入、XSS、盲注等常见的一些安全漏洞...2016-11-25
ASP.NET Core根据环境变量支持多个 appsettings.json配置文件
这篇文章主要介绍了ASP.NET Core根据环境变量支持多个 appsettings.json配置文件，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧...2021-09-22- PHP代码如下：复制代码 代码如下:if (isset($_FILES["Filedata"]) || !is_uploaded_file($_FILES["Filedata"]["tmp_name"]) || $_FILES["Filedata"]["error"] != 0) { $upload_file = $_FILES['Filedata']; $fil...2013-10-04
- 这篇文章主要介绍了记一次EFCore类型转换错误及解决方案，帮助大家更好的理解和学习使用asp.net core，感兴趣的朋友可以了解下...2021-09-22
- 本案例非通用，仅作笔记以备用 修改后的结果是 百度编辑器里上传的图片路径为/d/file/upload1...2014-07-03
- 这篇文章主要介绍了SpringMVC文件上传原理及实现过程解析,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下...2020-07-15
借助FileReader实现将文件编码为Base64后通过AJAX上传
这篇文章主要介绍了借助FileReader实现将文件编码为Base64后通过AJAX上传的方法,包括后端对文件数据解码并保存的PHP代码,需要的朋友可以参考下...2015-12-25- APC模块，它的全称是Alternative PHP Cache。APC可以将所有PHP代码会被缓存起来， 另外它可提供一定的内存缓存功能.但是这个功能并不是十分完美,有报告说如果频繁使用APC缓存的写入功能,会导致不可预料的错误.如果想使用...2015-10-30
- 这篇文章主要为大家详细介绍了js实现上传文件添加和删除文件选择框 ,具有一定的参考价值，感兴趣的小伙伴们可以参考一下...2016-10-25
- 这篇文章主要介绍了jQuery+ajax简单实现文件上传的方法,结合实例形式简单分析了jQuery基于ajax的post方法进行文件传输及asp.net后台处理技巧,需要的朋友可以参考下...2016-06-12
- 这篇文章主要介绍了smartupload实现文件上传时获取表单数据的相关资料,非常不错，具有参考借鉴价值，需要的朋友可以参考下...2017-01-09
- 本文实例讲述了PHP多文件上传类，分享给大家供大家参考。具体如下：<?phpclass Test_Upload{ protected $_uploaded = array(); protected $_destination; protected $_max = 1024000; protected $_messages =...2015-10-30