拖放文件上传和jquery验证

Question

当我拖放文件上载正常时，我正在表单中使用拖放文件上载。我正在使用JQuery validate插件（https://jqueryvalidation.org/）来验证我的表单，但仍会抛出验证来上传我的文件。请在下面检查我的代码 HTML代码：

    <div class="uploadField">
                    <div class="fileDrag text-center">
                        <h4>Drag and Drop</h4>
                        <div>OR</div>
                        <div class="fileHyperlink"><a href="#">Browse from your computer</a></div>
                    </div>
                    <input type="file" name="resume"  id="resume" alt="Upload your resume" title="Upload your resume">
                    <input type="hidden" name="resumefile"  id="resumefile" >

                </div>

验证码：

$("#registertutor").validate({
ignore: [],
rules: {

    email: {
        required: true,
        email: true,
        remote: {
            url: "/home/checkemail/",
            type: "post"
        }

    },
    confirm_email: {
        required: true,
        email: true,
        equalTo: "#email"

    },
    password: {
        required: true,
        minlength: 6,
        maxlength: 10,

    },
    confirm_password: {
        required: true,
        equalTo: "#password"

    },
    first_name: {
        required: true,

    },
    last_name: {
        required: true,

    },
    user_country: {
        required: true,

    },
    user_states: {
        required: true,

    },
    user_city: {
        required: true,

    },
    user_zipcode: {
        required: true,

    },
    // skills: {
    //     required: true,
    //     minlength: 1
    // },
    'tutor_skills[]': {
        required: true,
        minlength:1
    },
    resume: {
        required: true,
        extension: "doc|docx|pdf"

    },
     terms_agree: {
        required: true,
    },



},
messages: {
    email: {
        remote: "Email address already exists in our system"
    },
    confirm_email: {
        equalTo: "Please enter the same email"
    },
    confirm_password: {
        equalTo: "Please enter the same password"
    },
    resume: {
        required: "Please upload your resume",
        extension: "Please upload doc,docx and pdf format only"
    },
    terms_agree: {
        required: "Please accept our terms and conditions",
    }
}

});

文件上传代码：

  $(function() {

// preventing page from redirecting
$("html").on("dragover", function(e) {
    e.preventDefault();
    e.stopPropagation();

});

$("html").on("drop", function(e) { e.preventDefault(); e.stopPropagation(); });

// Drag enter
$('.uploadField').on('dragenter', function (e) {

    e.preventDefault();
    e.stopPropagation();
});

// Drag over
$('.uploadField').on('dragover', function (e) {

    e.preventDefault();
    e.stopPropagation();
});

// Drop
$('.uploadField').on('drop', function (e) {

    e.preventDefault();
    e.stopPropagation();


    var file = e.originalEvent.dataTransfer.files;
    var fd = new FormData();
    console.log(file[0])
    fd.append('file', file[0]);

    uploadData(fd);
});

// Open file selector on div click
// $(".uploadField").click(function(){
//     $("#resume").click();
// });

// file selected
$("#resume").change(function(){
    var fd = new FormData();

    var files = $('#resume')[0].files[0];
    console.log(files)
    fd.append('file',files);

    uploadData(fd);
});
});

// Sending AJAX request and upload file
function uploadData(formdata){

$.ajax({
    url: '/upload',
    type: 'post',
    data: formdata,
    contentType: false,
    processData: false,
    dataType: 'json',
    success: function(response){
        if(response.status=="success"){
       //     $("#resume").css('display','none');
            $("#resume").valid(true);
            addThumbnail(response);
        }


    }
   });
   }

// Added thumbnail
function addThumbnail(data){
$(".fileUploaded").css('display','block');
$(".fileUploaded .fileName").text(data.filename);
$(".fileUploaded .deleteOpt").find('a').attr('data-file',data.filename);
$(".fileUploaded     .downloadOpt").find('a').attr('href','/downloadfile?file='+data.filename);
$("#resumefile").val(data.filename);


}

  // Bytes conversion
 function convertSize(size) {
var sizes = ['Bytes', 'KB', 'MB', 'GB', 'TB'];
if (size == 0) return '0 Byte';
var i = parseInt(Math.floor(Math.log(size) / Math.log(1024)));
return Math.round(size / Math.pow(1024, i), 2) + ' ' + sizes[i];
 }

function deleteFile(e){
var filename=$(e).attr('data-file');
$.ajax({
    url: '/deletefile?file='+filename,
    type: 'post',
    contentType: false,
    processData: false,
    dataType: 'json',
    success: function(response){
        if(response.status=="success"){
            $(".fileUploaded").css('display','none');

        }


    }
});

}