>  기사  >  웹 프론트엔드  >  jQuery 파일 업로드 플러그인 Uploadify 사용 가이드_jquery

jQuery 파일 업로드 플러그인 Uploadify 사용 가이드_jquery

WBOY
WBOY원래의
2016-05-16 16:46:001354검색

Flash를 지원하지 않는 Apple 휴대폰의 Safari 브라우저를 피하기 위해 HTML5 버전은 모바일 브라우저를 더 잘 지원합니다.
주요 기능: 다중 파일 업로드 지원, HTML5 버전의 드래그 앤 드롭 업로드, 실시간 업로드 진행률 표시줄 표시, 파일 크기, 파일 유형, 버튼 이미지 정의, 업로드 파일 스크립트 등과 같은 강력한 매개변수
사용자 정의 기능

Flash 버전 사용 방법:
1. JS 및 CSS 로드

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




4. 매개변수 구성에 대한 자세한 설명

uploader: uploadify.swf 파일의 상대 경로입니다. swf 파일을 클릭하면
파일 열기 대화 상자가 희미해집니다. 기본값: uploadify.swf.
스크립트: 백그라운드 핸들러의 상대 경로입니다. 기본값: uploadify.php
checkScript: 업로드된 선택된 파일이 서버에 존재하는지 확인하는 데 사용되는 백그라운드 처리 프로그램의 상대 경로
fileDataName: 이름을 설정하고, 업로드된 파일은 이 이름을 기반으로 검색됩니다. 서버 처리 프로그램 데이터에서. 기본값은 Filedata입니다.
method: 제출 방법 Post 또는 Get 기본값은 Post입니다.
scriptAccess: 플래시 스크립트 파일의 액세스 모드, 로컬 테스트를 위해 항상으로 설정된 경우 기본값: sameDomain
folder: 업로드된 파일이 있는 디렉터리 저장되었습니다.
queueID: 파일 큐의 ID로, 파일 큐를 저장하는 div의 ID와 일치합니다.
queueSizeLimit: 여러 파일 생성을 허용하는 경우 선택한 파일 수를 설정합니다. 기본값: 999.
multi: true로 설정하면 여러 파일을 업로드할 수 있습니다.
auto: true로 설정하면 파일 선택 후 바로 업로드됩니다. false로 설정하면 업로드 버튼을 눌러야 업로드됩니다.
fileDesc: 이 속성 값은 유효하기 전에 fileExt 속성으로 설정되어야 합니다. 이는 파일 선택 대화 상자에서 프롬프트 텍스트를 설정하는 데 사용됩니다. 예를 들어
fileDesc를 "rar doc pdf를 선택하십시오."로 설정합니다. file"
fileExt: 설정 선택할 수 있는 파일 형식, 형식은 '*.doc;*.pdf;*.rar'입니다.
sizeLimit: 업로드된 파일의 크기 제한입니다.
simUploadLimit: 허용되는 동시 업로드 수 기본값: 1.
buttonText: 찾아보기 버튼의 텍스트, 기본값: BROWSE.
buttonImg: 버튼 이미지를 탐색하는 경로입니다.
hideButton: 찾아보기 버튼의 이미지를 숨기려면 true로 설정합니다.
롤오버: 값은 true와 false입니다. true로 설정하면 탐색 버튼 위로 마우스를 이동할 때 반전 효과가 나타납니다.
너비: 찾아보기 버튼의 너비를 설정합니다. 기본값: 110.
높이: 찾아보기 버튼의 높이를 설정합니다. 기본값: 30.
wmode: 이 항목을 투명으로 설정하면 찾아보기 버튼의 플래시 배경 파일이 투명해지며, 플래시 파일은 페이지의 최상위 레이어로 설정됩니다
. 기본값: 불투명.
cancelImg: 파일 큐에 파일을 선택한 후 각 파일에 있는 닫기 버튼 아이콘

위에 소개된 키 값의 값은 모두 문자열 또는 Boolean 유형으로 상대적으로 간단하며 다음에 소개하겠습니다. 키 값의 값은 파일을 선택하거나 오류가 발생하거나 기타 작업을 수행할 때 사용자에게 일부 정보를 반환할 수 있는 함수입니다.

onInit: 초기화 작업 수행
onSelect: 파일이 선택될 때 트리거됩니다. 이 함수에는 세 가지 매개변수
event가 있습니다.
queueID: 파일의 고유 식별자로, 임의의 6개 문자로 구성됩니다.
fileObj: 선택한 파일 개체에는 이름, 크기, 생성 날짜, 수정 날짜 및 유형의 5가지 속성이 있습니다.
코드는 다음과 같습니다.

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