Jquery ajaxsubmit 업로드 이미지 구현 code_jquery

그리고 통합 업로드 기능이 확립되어 있지 않습니다. 그래서 코드가 수정되었습니다. 나는 ajax를 사용하여 사진을 비동기적으로 업로드하는 것에 대해 생각했습니다. 이 기술은 매우 구식일 것입니다. 그래서 막강한 cnblog를 직접 열어서 이 글을 쉽게 찾아보고, 예시를 직접 따라하며 작가님의 노고의 결실을 직접 '사용'했습니다. 전체 코드가 빠르게 변환되었습니다. 그런데 문제는 프로그램을 서버에 공개했을 때 발생했습니다. 업로드한 파일에 실패했습니다! 땀~ 다 게으름의 산물이군요. 앞서 참조한 기사를 계속해서 열어보세요. 알고 보니 작성자는 로컬에서만 사용할 수 있고 서버에 게시할 수는 없다고 설명했습니다. 아직도 iframe http post라는 우울한 방법을 사용해야 하는지 궁금합니다. ?

그래서 저는 더 강력한 Google을 열기를 꺼리고 전 세계에서 솔루션을 찾기 시작했습니다. 마침내 노력이 결실을 맺었습니다. "jquery.form.js"를 찾았습니다.

이미지를 비동기적으로 업로드하는 단계는 다음과 같습니다.

1. jquery js 프레임워크를 참조한 다음(이것의 이점은 논의할 필요가 없음) "jquery.form.js"를 참조합니다.
2. 일반 핸들러 ashx를 만듭니다.
핵심 코드는 다음과 같습니다.
html:

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

코드 복사

코드는 다음과 같습니다. 네임스페이스 TestMvc.Utility { /// /// PicUploadHander에 대한 요약 설명

///

공개 클래스 PicUploadHandler
{

public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/plain";
//업로드 권한 확인 TODO
string _fileNamePath = ""
try;
{
_fileNamePath = context .Request.Files[0].FileName;
//업로드 시작
string _savedFileResult = UpLoadImage(_fileNamePath, context)
context.Response.Write(_savedFileResult) );
}
catch
{
context.Response.Write("업로드 제출 오류")
}
}


참고: 전체 업로드는 ajax 비동기 데이터를 사용하고 jquery 콜백은 성공적인 업로드 후 서버에 있는 이미지의 상대 경로입니다. 일반적으로 이 방법은 기존의 사진 업로드 방법보다 더 좋습니다.
여기에서 이 예제의 코드를 다운로드하면 FireFox에서 테스트를 통과했습니다.
http://xiazai.jb51.net/201011/yuanma/AjaxUploadPic.rar