我如何使用javascript验证图像的两个文件上传 [英] How I validate two file upload for images using javascript

问题描述

我使用javascript验证一个文件上传及其工作正常，但我如何使用此javascript进行两个文件上传。



这是代码： -

i use javascript to validate one file upload and its work good but how i use this javascript for two File Upload.

This is code:-

$(document).ready(function () {
            $("form").submit(function (e) {
                var form = this;
                e.preventDefault(); //Stop the submit for now
                //Replace with your selector to find the file input in your form
                var fileInput = $(this).find("#File_ar")[0],
                    file = fileInput.files && fileInput.files[0];

                console.log(file)
                if (file) {
                    var img = new Image();

                    img.src = window.URL.createObjectURL(file);

                    img.onload = function () {
                        var width = img.naturalWidth,
                            height = img.naturalHeight;

                        window.URL.revokeObjectURL(img.src);

                        if (width == 1024 && height == 358) {
                           form.submit(); 
                        }
                        else
                        {
                            alert('Image must be 1024 * 158');
                        }
                    };
                }
            });
        });

这是视图中的两个输入： -

and this is two input in view :-

<input class="form-control" data-val="true" data-val-required="This field is required" id="File_ar" name="File_ar" type="file" value="">

<input class="form-control" data-val="true" data-val-required="This field is required" id="File_en" name="File_en" type="file" value="">

我尝试了什么：



i尝试在同一个脚本中使用File_en和File_ar一起输入这样做？

What I have tried:

i Try to use File_en Input With File_ar in the same script, How i do this?

推荐答案

（ document ）。ready（ function （）{

(document).ready(function () {

（ form）。提交（< span class =code-keyword> function （e）{
var form = this ;
e.preventDefault（）; // 暂时停止提交
/ / 替换为您的选择器以查找表单中的文件输入
var fileInput =

("form").submit(function (e) { var form = this; e.preventDefault(); //Stop the submit for now //Replace with your selector to find the file input in your form var fileInput =

（ this ）。find（ ＃File_ar）[ 0 ]，
file = fileInput.files&& fileInput.files [ 0 ];

console .log（file）
if （file） {
var img = new Image（）;

img.src = window .URL.createObjectURL（file）;

img.onload = function （）{
var width = img.naturalWidth，
height = img.naturalHeight;

window .URL.revokeObjectURL（img.src）;

if （width == 1024 && height == < span class =code-digit> 358 ）{
form.submit（）;
}
其他
{
alert（' 图片必须为1024 * 158'）;
}
};
}
}）;
}）;

(this).find("#File_ar")[0], file = fileInput.files && fileInput.files[0]; console.log(file) if (file) { var img = new Image(); img.src = window.URL.createObjectURL(file); img.onload = function () { var width = img.naturalWidth, height = img.naturalHeight; window.URL.revokeObjectURL(img.src); if (width == 1024 && height == 358) { form.submit(); } else { alert('Image must be 1024 * 158'); } }; } }); });

这是视图中的两个输入： -

and this is two input in view :-

<input class="form-control" data-val="true" data-val-required="This field is required" id="File_ar" name="File_ar" type="file" value="">

<input class="form-control" data-val="true" data-val-required="This field is required" id="File_en" name="File_en" type="file" value="">

我尝试了什么：



i尝试在同一个脚本中使用File_en和File_ar一起输入这样做？

What I have tried:

i Try to use File_en Input With File_ar in the same script, How i do this?

这篇关于我如何使用javascript验证图像的两个文件上传的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！