通過點擊模態外觸發dropzone取消事件

Question

我在使用dropzonejs上傳文件組件的項目上工作。但是，我在嘗試使其更加自定義時遇到了這個問題。

如果您點擊模式窗口（bootstrap modal）的以外的某處，應觸發dropzonejs取消按鈕事件（警報/確認框，請參閱附圖）。但它不會像這樣發生，並且從未在文檔中看到任何相關內容。

任何解決方案？

Answer 1

我已經通過下述這個非常手動和骯髒的方式comeover：

我用window.onbeforeunload做什麼，我想真實的標誌。重點在於，上傳過程成功結束後，解除綁定，以防止始終詢問「您確定要取消此上傳嗎？」即使它完成了。

var cancelConfirmation = "Are you sure you want to cancel this upload?"; 

var isFileInProgress = false; 

var uploadZone = $("form[class=dropzone]").dropzone({ 
    method: "post", 
    uploadMultiple: false, 
    parallelUploads: 1, 
    dictCancelUploadConfirmation: cancelConfirmation, 
    success: function (file, response) { 
     isFileInProgress = false; 

     window.onbeforeunload = function() { }; 
    }, 
    init: function() { 
     this.on("error", function (file, response) { 
      isFileInProgress = false; 

      window.onbeforeunload = function() { /* unbind */ }; 
     }); 

     this.on("addedfile", function() { 
      isFileInProgress = true; 

      window.onbeforeunload = function() { 
       return cancelConfirmation; 
      }; 
     }); 

     this.on("complete", function() { 
      isFileInProgress = false; 

      window.onbeforeunload = function() { /* unbind */ }; 
     }); 

     this.on("canceled", function() { 
      isFileInProgress = false; 

      window.onbeforeunload = function() { /* unbind */ }; 
     }); 
    } 
}); 

$(".modal").on('hide.bs.modal', function (event) { 
    if (isFileInProgress && !confirm(cancelConfirmation)) { 
     event.preventDefault(); 
    } 
});