通过jQuery中的数组进行多个文件上传验证

Question

下面是我的脚本代码

<script>
        $(document).ready(function (){    
            $("#checkfields").click(function (){

                var file1=$("#file1").val();
                if(file1){                        
                    var file_size=$('#file1')[0].files[0].size;
                    if(file_size<2097152){
                        var ext = $('#file1').val().split('.').pop().toLowerCase();                            
                        if($.inArray(ext,['jpg','jpeg','gif'])===-1){
                            alert("Invalid file extension");
                            return false;
                        }

                    }else{
                        alert("Screenshot size is too large.");
                        return false;
                    }                        
                }else{
                    alert("fill all fields..");         
                    return false;
                }
            });
        });
    </script>

下面是我的代码

<form action="checkmobile.php" method="post" enctype="multipart/form-data" class="form-horizontal"> 
<div class="form-group">
                        <label for="element-13" class="control-label col-lg-2">Add Screenshots</label>
                        <div class="input-group">                            
                            <input type="file" id="file1" name="file[]" class="btn" multiple="multiple">
                        </div>
                    </div>
<div class="form-group">

                                <input type="submit" id="checkfields" class="btn btn-primary  col-lg-offset-2" value="Add">
                                <button class="btn btn-default col-lg-offset-1">Cancel</button>
                            </div>
                </form>

现在我想知道如何在 jQuery 中使用数组来验证输入下的所有选定文件。

如果我选择一个图像和一个视频，那么它必须检查图像和视频的验证。首先，如果图像正常，它将验证图像，然后它将通过无效的扩展名拒绝视频。

我想在提交按钮时验证所有文件，如果图像无效则返回错误，如果选择了带有图像的视频，则它也返回错误。

请帮忙。

Answer 1

尝试使用下面的代码 -

<script>
    $(document).ready(function (){    
        $("#checkfields").click(function (){
            //var modelname=$("#inputmodelname").val();
            for (var i = 0; i < $("#file1").get(0).files.length; ++i) {
                var file1=$("#file1").get(0).files[i].name;

                if(file1){                        
                    var file_size=$("#file1").get(0).files[i].size;
                    if(file_size<2097152){
                        var ext = file1.split('.').pop().toLowerCase();                            
                        if($.inArray(ext,['jpg','jpeg','gif'])===-1){
                            alert("Invalid file extension");
                            return false;
                        }

                    }else{
                        alert("Screenshot size is too large.");
                        return false;
                    }                        
                }else{
                    alert("fill all fields..");         
                    return false;
                }
            }
        });
    });
</script>

它单独验证所有选定的文件。我已经在“if”条件下评论了您的模型名称变量行，因为我在 HTML 中找不到任何与之相关的元素。