页面代码:
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; " > < 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