使用jquery文件上傳驗證文件？

Question

我正在使用jquery文件上傳，如下所示。

dialogElem.find('#upload-image-file-input').fileupload({
            url: url,
            dataType: 'json',
            autoUpload: true,
            acceptFileTypes: /(\.|\/)(gif|jpe?g|png)$/i,
            maxFileSize: 5000000, // 5 MB
            // Enable image resizing, except for Android and Opera,
            // which actually support image resizing, but fail to
            // send Blob objects via XHR requests:
            disableImageResize: /Android(?!.*Chrome)|Opera/
                .test(window.navigator.userAgent),
            previewMaxWidth: 100,
            previewMaxHeight: 100,
            previewCrop: true
        }).on('fileuploadadd', function (e, data) {
            var fileCount = data.originalFiles.length;
            if (fileCount > 5) {
                alert("The max number of files is : "+5);
                return false; 
            }
          }).on('fileuploadprocessalways', function (e, data) {
              //some logic
           }).on('fileuploadprogress', function (e, data) {
              //some logic
           }).on('fileuploaddone', function (e, data) {
              //some logic
            }).on('fileuploadfail', function (e, data) {
              //some logic
            })

在fileuploadadd內部，我添加了一些驗證邏輯。 如果驗證失敗，如何停止所有其他事件，例如fileuploadprogress ， fileuploadfail和fileuploadprocessalways ？

Answer 1

如果您有一些像我幾周前一樣的任務，請嘗試以下操作：

您可以通過中止XHR（ajax請求）調用來取消正在進行的上傳。 您可以綁定到文件輸入字段的fileuploadadd事件，在保留jqXHR對象的同時提交請求，並將其用於中止：

jqXHR.abort();

例如：

$(".cloudinary-fileupload").bind('fileuploadadd', function(e, data) {
    jqXHR = data.submit(); // Catching the upload process of every file
});

$('#cancel_button').click(function (e) {
    if (jqXHR) {
        jqXHR.abort();  
        jqXHR = null;
        console.log("Canceled");
    }
    return false;
});

下一頁包含更多代碼示例https://github.com/blueimp/jQuery-File-Upload/issues/290

只是打電話

if (fileCount > 5) { 
jqXHR.abort();  
jqXHR = null; }

Answer 2

jqXHR.abort（）對我不起作用。 但是throw中止“添加”處理：

.bind('fileuploadadd', function (e, data) {
    if (total_uploads >= maxImagesPerPost){
        throw new Error('Upload maximum reached');
    }