JQuery 플러그인 ajaxfileupload.js 비동기 파일 업로드 example_jquery

서버 측 파일 업로드 과정에서 웹 서버의 단기 업로드 제어 기능을 사용해 파일을 업로드하면 페이지가 한 번 새로 고쳐지는데, 이는 사용자 경험에 그다지 친숙하지 않습니다. ajaxfileupload.js는 사용하기 쉽고 사용하기 쉬운 jQuery 비동기 파일 업로드 플러그인입니다.

전제 조건: ajaxfileupload.js 파일, Baidu에서 다운로드하기만 하면 됩니다.

JS 참조:

코드 복사 코드는 다음과 같습니다.

html 코드:

코드 복사 코드는 다음과 같습니다.

JS 코드:

코드 복사 코드는 다음과 같습니다.

함수 saveCInfo() {
               var filename = document.getElementById("fileToUpload").value;
                 if (파일 이름 != "") {
                    $.ajaxFileUpload({
                     URL: '../Order/OrderExec.ashx?oprMode=fileUpload' "&filename=" 파일 이름 "&billno=" billno "&companyname=" 회사 이름,
secureuri: 거짓,
                        fileElementId: 'fileToUpload',//업로드 제어 ID
                                //dataType: 'json',
                   오류: 함수 () { 경고('오류') },
성공: 함수(datax) {
If (datax != "") {
                               msgShow('시스템 프롬프트', '업로드 성공!', '정보');
                           } else {
                                msgShow('시스템 프롬프트', '업로드 실패!', '정보');
|                  }
                });
              } else {
$ .Messager.alert('프롬프트', '업로드 파일을 선택하세요', '정보')
            }
}

백엔드 코드:

코드 복사 코드는 다음과 같습니다.

공개 무효 FileUpload(HttpContext 컨텍스트)
            {
             시도해 보세요
                {
                     context.Response.ContentType = "text/html";
                    문자열 회사 이름 = context.Request.Params["companyname"];
문자열 billno = context.Request.Params["billno"];
                      문자열 파일 이름 = context.Request.Params["filename"];
                     문자열 이름 = 회사 이름 "_" billno "_" 파일 이름;
                        HttpFileCollection 파일 = HttpContext.Current.Request.Files;
//서버에 업로드된 파일의 저장 경로를 지정합니다
                    string savePath = context.Server.MapPath("~/upload/");
//이 물리적 경로가 서버에 있는지 확인하고, 없으면 만듭니다.
If (!System.IO.Directory.Exists(savePath))
                                             {
System.IO.Directory.CreateDirectory(savePath);
                }
                     savePath = savePath 이름;//업로드 파일 경로
                files[0].SaveAs(savePath);//파일 저장
                      context.Response.Write(savePath);
            }
              잡기 (예외 예)
                {
                    context.Response.Write("FileUpload: " ex.Message);
            }

}