
jQuery 직렬화 및 FormData를 사용한 파일 업로드
jQuery 직렬화 기능을 사용하여 양식을 제출할 때 입력 파일 필드가 발생하면 문제가 발생할 수 있습니다. 표준 직렬화 방법은 파일 데이터를 캡처하지 않으므로 서버 스크립트에 빈 $_FILES가 발생합니다.
해결책: FormData
이 문제를 해결하려면 FormData를 사용하세요. 파일을 포함한 모든 유형의 양식 데이터를 지원하는 개체입니다. 포괄적인 솔루션은 다음과 같습니다.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 | $(document).on( "submit" , "form" , function (event) {
event.preventDefault();
var serialized = new FormData(this);
$.ajax({
url: $(this).attr( "action" ),
type: $(this).attr( "method" ),
dataType: "JSON" ,
processData: false,
contentType: false,
data: serialized,
success: function (data, status) {
},
error: function (xhr, desc, err) {
},
});
});
|
로그인 후 복사
FormData의 이점:
-
여러 파일 업로드 지원: FormData를 사용하면 여러 파일을 업로드할 수 있습니다. 파일을 동시에.
-
크로스 브라우저 호환성: FormData는 모든 주요 브라우저에서 지원되므로 더 넓은 접근성을 보장합니다.
-
비동기: jQuery 직렬화와 마찬가지로 FormData는 비동기식 파일 업로드를 지원하여 사용자 경험을 향상시키고 페이지 로드 시간을 단축합니다.
FormData를 jQuery와 함께 활용하면 기존 직렬화의 제한 없이 양식에서 파일 업로드를 원활하게 처리할 수 있습니다. 방법.
위 내용은 jQuery 직렬화를 사용하여 파일 업로드를 어떻게 처리할 수 있나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!