激情久久久_欧美视频区_成人av免费_不卡视频一二三区_欧美精品在欧美一区二区少妇_欧美一区二区三区的

服務器之家:專注于服務器技術及軟件下載分享
分類導航

PHP教程|ASP.NET教程|Java教程|ASP教程|編程技術|正則表達式|C/C++|IOS|C#|Swift|Android|VB|R語言|JavaScript|易語言|vb.net|

服務器之家 - 編程語言 - ASP.NET教程 - ASP.NET MVC4 利用uploadify.js多文件上傳

ASP.NET MVC4 利用uploadify.js多文件上傳

2020-04-28 12:22Resources ASP.NET教程

本文主要介紹了ASP.NET MVC4利用uploadify.js實現多文件上傳的方法代碼。具有很好的參考價值。下面跟著小編一起來看下吧

頁面代碼:

1.引入js和css文件

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
 <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內代碼

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
  <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>

后臺代碼:

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
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");
   }
  }

以上就是本文的全部內容,希望本文的內容對大家的學習或者工作能帶來一定的幫助,同時也希望多多支持服務器之家!

原文鏈接:http://www.cnblogs.com/Resources-blogs/p/6599236.html

延伸 · 閱讀

精彩推薦
主站蜘蛛池模板: 黄色免费在线网址 | 国产精品视频一区二区噜噜 | 欧美日本另类 | 天使萌一区二区三区免费观看 | 日韩黄色精品视频 | 欧美大逼网 | 一区二区三区在线播放视频 | 91国在线高清视频 | 一级黄色片在线看 | 亚洲第五色综合网 | 日韩黄色免费观看 | 国产电影精品久久 | 国产精品久久久久久久亚洲按摩 | 99久久自偷自偷国产精品不卡 | 日本韩国欧美一级片 | 嫩呦国产一区二区三区av | 99视频网址 | 在线2区| 亚洲aⅴ在线观看 | 国产成人羞羞视频在线 | www.9191.com | 国产成人综合在线视频 | 在线成人免费观看视频 | 国产日韩精品欧美一区视频 | 国产精品久久久久无码av | 在线视频观看一区二区 | 国产手机国产手机在线 | 女教师~淫辱の动漫在线 | 亚洲va久久久噜噜噜久久男同 | 草莓视频在线导航 | 91 在线视频观看 | 成人乱码一区二区三区不卡视频 | 国产一区二区在线免费观看 | gogo全球大胆高清人露出91 | 在线观看免费污视频 | 国产精品久久久久久婷婷天堂 | 免费看成人av | 毛片视 | 中国黄色一级生活片 | 91超视频| 欧美亚洲国产一区二区三区 |