이 글에서는 주로 Ajax를 사용하여 파일을 업로드하기 위한 JavaScript용 샘플 코드를 소개합니다. 관심 있는 친구들은 이에 대해 배울 수 있습니다.
이 글에서는 Ajax를 사용하여 파일을 업로드하기 위한 JavaScript용 샘플 코드를 소개합니다.
파일을 업로드하는 방법에는 크게 두 가지가 있습니다.
양식을 사용하여 업로드를 제출하세요.
html 코드는 다음과 같습니다.
<form id="uploadForm" enctype="multipart/form-data"> <input id="file" type="file" name="file"/> <button id="upload" type="button">上传</button> </form>
현재 JavaScript 코드는 다음과 같습니다.
var formData = new FormDate($('#uploadForm')[0]); $.ajax({ url: 'http://10.10.2.254:8080/file/associateupload', type: 'POST', cache: false, data: formData, processData: false, contentType: false, success:function(res){ console.log(res); } });
참고:
processData가 false로 설정되어 있습니다. 데이터 값은 FormData 개체이므로 데이터를 처리할 필요가 없습니다.
캐시는 false로 설정되어 있으며 파일 업로드에는 캐싱이 필요하지 않습니다.
contentType이 false로 설정되었습니다. 이는
FormData 객체를 사용하여 파일을 업로드할 필드를 추가하세요
html 코드는 다음과 같습니다.
<p id="uploadp"> <input id="file" type="file"/> <button id="upload" type="button">上传</button> </p>
JavaScript 구현은 다음과 같습니다.
var formData = new FormData(); formData.append('file', $('#file')[0].files[0]); $.ajax({ url: '/upload', type: 'POST', cache: false, data: formData, processData: false, contentType: false, success:function(res){ console.log(res); }
여기에는 몇 가지 차이점이 있습니다.
append( ) 두 번째 매개변수는 파일 객체여야 합니다(예: $('#file')[0].files[0]. contentType도 false로 설정해야 합니다.
코드 $('#file')[0].files[0]에서 태그가 여러 파일을 업로드할 수 있다는 것을 알 수 있습니다. ="file">에 여러 개의 "multiple" 속성을 추가합니다.
위 내용은 JavaScript가 Ajax를 사용하여 파일을 업로드하는 방법 소개의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!