Question

需要一些有关文件上传验证的帮助，目前我有一个脚本，用于检查最大上传大小和正确的文件类型。

验证工作正常，但是如果也没有选择文件，则“文件类型”验证部分会显示错误消息。

有没有办法修改代码说如果没有选择文件，则提交表单；如果有文件，则在提交之前检查其类型是否正确。

谢谢，如果您需要更多信息，请告诉我。

<form method="post" enctype="multipart/form-data" action="thankyou.html" name="SampleForm" id="app-form">
    <p>
    <label class="sr-only" for="upload">Attach Resume </label>
    <input type="file" name="fileUpload" class="upload-file" data-max-size="5242880" id="fileUpload" accept=".pdf,.jpg,.jpeg,.png,.doc,.docx">
        <br>(.pdf, .jpg, .png, .doc, .docx file types only) Max 5MB
        <span class="error error-msg"></span>
        <span class="error error-msg-two"></span>   
    </p>    
    <p>
    <input type="submit" id="submitbutton" value="Submit" name="submitbutton">
    </p>

    </form>

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

    <script>

       $(document).ready(function(){
         //attachments  
           //for file size
        var fileInput = $('.upload-file');
        var maxSize = fileInput.data('max-size');
        var errmsg = 'File size is larger than 5MB';  
        $('#app-form').submit(function(e){
            if(fileInput.get(0).files.length){
                var fileSize = fileInput.get(0).files[0].size; // in bytes
                if(fileSize>maxSize){
                    $('.error-msg').text(errmsg);
                    return false;
                }else{
                    ''
                }       
            }
       });     
      //for file types
        $('#app-form').submit(function(e){
            var allowedFiles = [".doc", ".docx", ".pdf",".jpg",".jpeg",".png"];
            var fileUpload = $("#fileUpload");
            var errmsgtwo = 'Please upload the correct file type';
            var regex = new RegExp("([a-zA-Z0-9\s_\\.\-:])+(" + allowedFiles.join('|') + ")$");
            if (!regex.test(fileUpload.val().toLowerCase())) {
                $('.error-msg-two').text(errmsgtwo);
                $('.error-msg').text('');
                    return false;
            }else{
              $('.error-msg-two').text('');
              return true;
            }
          });
    });

</script>

Answer 1

只需选中此

var fileUpload = $("#fileUpload").val();
if(fileUpload){
   // when file exist
} else {
   // when file not exist
}

随时发表评论以寻求更多帮助

jQuery表单文件上传验证

1 个答案: