<strong>前台: upload.htm</strong> <br><div class="codetitle"> <span><a style="CURSOR: pointer" data="43058" class="copybut" id="copybut43058" onclick="doCopy('code43058')"><u>复主代码</u></a></span> 代码如下:</div> <div class="codebody" id="code43058"> <br>< ;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <br><html xmlns="http://www.w3.org/1999/xhtml"> <br><head runat="server"> <br><title>업로드</title> <br><link href="upload.css" rel="스타일시트" /> <br></head> <br><본문> <br><양식> <br><ul> <br><li> <br><button id="SubUpload" onclick="TSubmitUploadImageFile();return false;"> <br>确定上传</button> <br><button id="CancelUpload" class="ManagerButton" onclick="javascript:history.go(-1);"> <br>取消</button> <br><button id="AddUpload" class="ManagerButton" onclick="TAddFileUpload();return false;"> <br>增加</button> <br></li> <br></ul> <br><ul id="loadimage"> <br><li> <br><div class="imagelabel"> <br>그림 1:</div> <br><div class="imagepath"> <br><input name="" size="45" id="uploadImg1" type="file" /></div> <br><div class="loadinfo"> <br><span id="uploadImgState1"></span> <br></div> <br></li> <br></ul> <br></form> <br></body> <br></html> <br><script type="text/javascript" src="http://www.cnblogs.com/JS/jquery-1.3.2-vsdoc.js"></script> <br><script type="text/javascript"> <br>var TfileUploadNum = 1; //여기서 그림은 <br>var Tnum = 1; //ajax上传图文时索引 <br>//增加上传按钮 <br>function TAddFileUpload() { <br>var idnum = TfileUploadNum 1; <br>var str = "<li>"; <br>str = "<div class='imagelabel'>그림" idnum ":</div>"; <br>str = "<div class='imagepath'><입력 이름='' size='45' id='uploadImg" idnum "' type='file' /></div>" ; <br>str = "<div class='loadinfo'><span id='uploadImgState" idnum "'></span></div>"; <br>str = "</li>"; <br>$("#loadimage").append(str); <br>TfileUploadNum = 1; <br>} <br>//开始上传 <br>function TSubmitUploadImageFile() { <br>document.getElementById("SubUpload").disabled = true; <br>document.getElementById("CancelUpload").disabled = true; <br>document.getElementById("AddUpload").disabled = true; <br>setTimeout("TajaxFileUpload()", 1000); //此为关键代码 <br>} <br>//Ajax상위방법 <br>function TajaxFileUpload() { <br>if (Tnum < TfileUploadNum 1) { <BR>//准备提交处 <BR>리$ ("#uploadImgState" Tnum).html("<img src='/gif/upfileloader.gif'/>"); <br>//开始提交 <br>$.ajax({ <br>type: "POST", <br>url: "Handler.ashx", <br>data: { upfile: $("#uploadImg" Tnum ).val()}, <br>success: function(data, status) { <br>var stringArray = data.split("|"); <br>//stringArray[0] 成功状态(1为成功, 0为失败) <br>//stringArray[1] 上传成功的文件name <br>//stringArray[2] 消息提示 <br>if (stringArray[0] == "1") { <br>//上传成功 <br>$("#uploadImgState" Tnum).html("<img src='/gif/Success.gif' />" stringArray[1] "--" stringArray[2]) <br>} <br>else { <br>//上传出错 <br>$("#uploadImgState" Tnum).html("<img src='/gif/Error.gif' />" stringArray[1] "--" stringArray[2]); <br>} <br>Tnum <br>setTimeout("TajaxFileUpload()", 1000) <br>} <br>}); <br>} <br>else { <br>document.getElementById("SubUpload").disabled = false; <br>document.getElementById("CancelUpload").disabled = false; <br>document.getElementById("AddUpload").disabled = false; <br>} <br>} <br></script> <br> </div> <br><strong>处理程序Handler.ashx <br></strong><div class="codetitle"> <span><a style="CURSOR: pointer" data="34772" class="copybut" id="copybut34772" onclick="doCopy('code34772')"><u>复主代码</u></a></span> 代码如下:</div> <div class="codebody" id="code34772"> <br><%@ WebHandler Language="C#" Class="Handler" %> <br>System.Web 사용 <br>System.IO 사용; System.Text; <br>System.Net 사용 <br>공용 클래스 Handler : IHttpHandler <br>{ <br>public void ProcessRequest(HttpContext context) <br>{ <br>//소스 이미지 경로<br>string _fileNamePath = ""; <br>try <br>{ <br>_fileNamePath = context.Request.Form["upfile"] <br>string _savedFileResult = UpLoadFile(_fileNamePath); .Write(_savedFileResult);//업로드 결과 반환<br>} <br>catch <br>{ <br>context.Response.Write("0|error|파일 경로 오류") <br>} <br> } <br>/// <summary> <br>/// 이미지 저장<br>/// </summary> <br>/// <param name="fileNamePath">/ param>/// <returns></returns> <br>private string UpLoadFile(string fileNamePath) <br>{ <br>//그림 형식<br>string fileNameExt = fileNamePath.Substring(fileNamePath. IndexOf ('.')).ToLower(); <br>if (!CheckFileExt(fileNameExt)) return "0|error|그림 형식이 잘못되었습니다!" <br>//경로 저장<br>string toFilePath = "ProductUpload /"; <br>//물리적 전체 경로<br>string toFileFullPath = HttpContext.Current.Server.MapPath(toFilePath) <br>//경로가 존재하는지 확인하고, 존재하지 않으면 생성합니다. <br> !Directory.Exists (toFileFullPath)) <br>{ <br>Directory.CreateDirectory(toFileFullPath); <br>} <br>//저장될 임의의 파일 이름 생성<br>string toFileName = GetFileName(); <br>//전체 경로가 저장됩니다<br>string saveFile=toFileFullPath toFileName fileNameExt; <br>///WebClient 인스턴스 생성<br>WebClient myWebClient = new WebClient()//Windows 네트워크 보안 인증 설정 <br>myWebClient.Credentials = CredentialCache.DefaultCredentials; <br>//업로드할 파일<br>FileStream fs = new FileStream(fileNamePath, FileMode.Open, FileAccess.Read); >BinaryReader r = new BinaryReader(fs ); <br> //다음 형식으로 UploadFile 메서드를 사용합니다. <br>return "1|" toFileName fileNameExt "|Save 성공적으로." <br>/// < ;summary> <br>/// 이미지 유형 감지 <br>/// <br>/// <param name="_fileExt"></param> 🎜>/// <returns>올바르게 True를 반환합니다</returns> <br>private bool CheckFileExt(string _fileExt) <br>{ <br>string[] allowedExt = new string[] { ".gif", ". jpg", ".jpeg" }; <br>for (int i = 0; i < allowedExt.Length; i ) <br>{ <br>if (allowExt[i] == _fileExt) { return true; } <br>} <br>false 반환 <br>} <br>/// <summary> <br>/// 임의의 사진 이름 가져오기<br>/// </summary> // <returns> </returns> <br>공개 정적 문자열 GetFileName() <br>{ <br>Random rd = new Random() <br>StringBuilder serial = new StringBuilder(); .Append(DateTime.Now .ToString("yyMMddHHmmssff")); <br>serial.Append(rd.Next(0, 9999).ToString()) <br>return serial.ToString(); <br>public bool IsReusable <br>{ <br>get <br>{ <br>return false <br>} <br>} <br>} <br><br> <br><br>CSS 스타일 upload.css<br> <br><br><br><br><br>코드 복사<br><br><br> 코드는 다음과 같습니다.</div> <br> <strong>body{font -size: 12pt;} </strong> ul{list-style: none;} <br>li{margin: 0px;} <div class="codetitle">#loadimage{width: 860px;overflow: Hidden;} <span>.imagelabel{ float : 왼쪽; 너비: 60px; 높이: 25px;} <a style="CURSOR: pointer" data="12746" class="copybut" id="copybut12746" onclick="doCopy('code12746')">.imagepath{float: 왼쪽; 너비: 400px; 높이: 25px; } <u>.loadinfo{float: 왼쪽; 너비: 400px; 높이: 25px </u></a></span> </div>