사진을 업로드할 때 매우 유용한 컨트롤을 찾았습니다. 여러 장의 사진을 동시에 업로드할 수 있도록 지원하며 사진을 클릭하여 업로드 상자로 끌어서 직접 업로드할 수도 있습니다. 사용하며, 인터페이스는 기본적으로 프로젝트에 직접 넣어 사용할 수 있습니다.
먼저 그의 스타일을 살펴보자.
이미지를 선택한 후:
$(function(){ // 플러그인 초기화 $(#demo).zyUpload({ width : 650px, // width height : 400px, // width itemWidth : 120px, // 파일 항목 너비 itemHeight : 100px, / / file 항목의 높이 url: /upload/UploadAction, // 업로드된 파일의 경로 multiple: true, // 여러 파일을 업로드할 수 있는지 여부 dragDrop: true, // 파일을 드래그하여 업로드할 수 있는지 여부 del : true, // 파일 삭제 가능 여부 FinishDel : false, // 파일 업로드 완료 후 미리보기가 삭제되는지 여부 /* 외부에서 획득한 콜백 인터페이스 */ onSelect : function(files, allFiles ){ //파일 선택을 위한 콜백 메소드 console.info(현재 다음 파일이 선택되어 있습니다:) console.info(이전에 업로드되지 않은 파일:); 모든 파일) }, onDelete: function(file, surplusFiles){ // 파일 삭제를 위한 콜백 메소드 console.info (현재 삭제된 파일:); console.info (현재 남은 파일:); ; }, onSuccess: function(file){ // 성공적인 파일 업로드를 위한 콜백 메서드 console.info(이 파일은 성공적으로 업로드되었습니다:), onFailure: function(file){ // 파일 업로드 실패에 대한 콜백 메소드 console.info(이 파일 업로드에 실패했습니다:); console.info(file) }, onComplete: function(responseInfo){ // 업로드 완료에 대한 콜백 메소드 console.info(파일 업로드 완료) ; 콘솔 .info(응답정보) } });
데모.js, url: /upload/UploadAction에서 구성을 직접 수정하고 이미지 업로드 작업을 입력하세요. 이 컨트롤은 포그라운드 처리일 뿐이므로 백그라운드 업로드를 직접 작성해야 합니다.
위의 내용은 이 기사의 전체 내용입니다. 모든 분들의 학습에 도움이 되기를 바랍니다. 또한 모든 분들이 VeVb Wulin Network를 지지해 주시길 바랍니다.