Javascript验证不适用于检查正在上传的文件

Question

我正在设计一个用户必须上传文件的表单。如果用户没有上传文件，我将使用 javascript 进行客户端验证，因此不会提交表单。它适用于表单中的所有其他字段，但不适用于正在上传的图像文件。它正在输入除我的图像功能之外的所有功能

这里是代码的摘录：

      <form action="<?php echo $_SERVER['PHP_SELF']?>" method="POST" onsubmit="return 
       validateForm()">


            <h3>Select image:
                <input type="file" name="fImg" id="fImge" accept="image/*">
            </h3>

            <input style="position: relative;top:-20px;left:10px; margin-bottom:5px ; 
           width:150px;height: 30px; float:right;background: #8B0000" type="submit" name="submit" 
           value="Save Changes">
      </form>


    <script>
    function validateForm()
    {


        if(!checkBlankImageById('fImge', 'Please choose an image'))
            return false;

        return true;
    }   //end validateForm()
    </script>

在我的外部 js 文件中

    function checkBlankImageById(obj_id, obj_label)
    {
     alert('entered');
     if($("#" + obj_id).files.length ==0)
    {

       alert(obj_label);
       return false;
    }
     return true;

}

Answer 1

来源

How to check if input file is empty in jQuery

jQuery

if ($("#"+obj_id).get(0).files.length === 0) {
    console.log("No files selected.");
}

原版 Javscript

if( document.getElementById("videoUploadFile").files.length == 0 ){
    console.log("no files selected");
}

说明：您正在尝试从 jQuery 对象获取文件长度的 vanilla javascript 方式