[javascript] Dropzone.js에서 파일 업로드 취소 기능을 구현하는 방법은 무엇인가요?

18 Dec 2023

javascript

우선, 업로드를 취소하고자 하는 파일이 이미 Dropzone에 추가되어 있다고 가정하겠습니다.

가장 간단한 방법은 해당 파일의 취소 버튼을 클릭하는 것입니다.

HTML에서:

<div class="dropzone" id="myDropzone"></div>

JavaScript에서:

// Dropzone 인스턴스를 생성합니다.
var myDropzone = new Dropzone("#myDropzone", { 
    // Dropzone 옵션들
});

// 파일 추가 후, 해당 파일의 취소 버튼을 클릭하여 업로드를 취소합니다.
myDropzone.on("addedfile", function(file) {
    // 취소 버튼을 클릭하여 업로드를 취소합니다.
    file.previewElement.querySelector(".dz-remove").addEventListener("click", function() {
        myDropzone.removeFile(file);
    });
});

위의 코드에서 myDropzone.removeFile(file) 메서드를 사용하여 파일을 삭제할 수 있습니다. 이를 통해 Dropzone.js에서 파일 업로드를 취소할 수 있습니다.