html 에서 file 컨트롤 에 대한 정리 (메모)

최근 회사 에 작은 프로젝트 를 만 들 었 습 니 다. 그 중 한 페이지 는 8 ~ 10 개의 첨부 파일 을 올 려 야 합 니 다. 즉, 한 페이지 에 최소 8 개의 파일 업로드 컨트롤 이 있어 야 합 니 다.
  초보적인 방법 은 다음 과 같다. 여러 개의 input [file] 컨트롤 을 form 에 제출 하면 nginx 환경 에서 최대 제한 을 초과 하고 413 entity too large 오 류 를 보고 할 수 있다.
  그 다음 에 하나의 파일 업로드 에 대해 비동기 방식 을 사용 하면 여러 파일 을 한꺼번에 제출 하 는 문 제 를 해결 할 수 있 습 니 다. 저 희 는 jQuery 의 ajax fileupload 플러그 인 을 사 용 했 습 니 다.그러나 이 어 사용자 체험 을 강화 하기 위해 서 는 업로드 에 성공 한 후 업로드 한 주 소 를 file 컨트롤 에 다시 입력 해 야 합 니 다. 브 라 우 저 는 js 에서 file 컨트롤 의 값 을 수정 하 는 것 을 거부 하기 때 문 입 니 다.
  결국 유행 하 는 swfupload 라 는 플래시 컨트롤 로 문 제 를 해결 했다.
이 기간 에 일부 file 의 브 라 우 저 조작 즉 호환성 문 제 를 발 견 했 습 니 다.
1. js 는 input [file] 컨트롤 의 값 을 제어 할 수 없습니다. "탐색" 을 눌 러 야 합 니 다.
2. input [file] 컨트롤 의 값 은 각 브 라 우 저 에서 가 져 올 수 있 지만 fireforx 에서 가 져 온 것 은 파일 의 이름 에 경 로 를 포함 하지 않 고 ie 에서 가 져 온 것 은 이 파일 이 사용자 기기 에서 의 전체 경 로 를 가 져 옵 니 다. 예 를 들 어 c: \ 1. jpg
3. ie 에서 js 트리거 file 컨트롤 로 탐색 (예 를 들 어 input [file] 의 display 를 none 으로 설정 하고 input [text] 로 대체 방안 으로 설정) 을 하면 제출 할 때 ie 는 '접근 거부 오류' 를 알려 줍 니 다.
ie 는 file 컨트롤 이 '탐색' 을 누 르 면 파일 을 업로드 해 야 하기 때 문 입 니 다.해결 방법 은 file 컨트롤 을 div 에 놓 고 스타일 을 투명 하 게 설정 하여 text 위 에 덮어 쓰 는 것 입 니 다. 사용자 가 본 것 은 text 컨트롤 입 니 다. 작 동 하 는 확실한 file 컨트롤 입 니 다.
4. fireforx 에서 머리 에 no - cache 가 설정 되 어 있 지만 여러 번 업로드 할 때 두 번 째 부터 처음으로 업로드 한 파일 을 가 져 옵 니 다 (예 를 들 어 첫 번 째 업로드 파일 이 너무 크 고 두 번 째 로 작은 파일 을 바 꾸 었 을 때 도 마찬가지 입 니 다. 디 버 깅 은 처음 업로드 한 파일 을 가 져 옵 니 다).
j. 해결 방법 은 다음 과 같 습 니 다. document. getElement ById 나 document. getElement sByName (예 를 들 어 upload (this)) 대신 file 컨트롤 대상 을 js 방법 으로 전달 합 니 다.
5.

var newFileObj = $(file    ).clone();

fireforx 에서 얻 은 new FileObj 는 new FileObj. val () 을 통 해 값 을 얻 을 수 있 습 니 다.그리고 ie 에서 new FileObj 의 값 은 비어 있 고 clone (true) 방법 으로 ie 에서 비어 있 습 니 다.