Как переписать простое условие чтобы...?

Question

[Сергей Миллер]

Есть такое условие, парюсь вторые сутки над ним.

// Перехват файлов с формы
if($(document).find('#registration input[type=file], #sign_in_page input[type=file]').length>0){ //если есть такой элемент
var files = {}; // тут хранятся файлы
var theInputFile = $(document).find('input[type=file]'); //определяем инпут тайп файл
$(document).on('change', 'input[type=file]', function(){ // при его изменении
var numFiles = $(this, this)[0].files.length; // получаем кол-во изображений выбранных пользователем (тут идет проверка именно на то, сколько пользователь выбрал файлов в своем обозревателе файлов, а есть ли возможность проверить сколько файлов попало в массив files?)
if(numFiles<=3){ //если юзер выбрал меньше или равно 3 файла, то
$('.totalPhotos span').text(numFiles); // покажем это кол-во на странице
$('.totalPhotos span').css('color', 'initial'); // придадим кол-ву исходный цвет шрифта
files = {}; // сначала очистим массив, так как юзер может перезагрузить файлы n раз
$('.combineLoaded').empty(); //очистим div где выводятся превью файлов по той же причине



$.each(this.files, function(i, file){ // берем каждый файл

if(!files[file['name']] && file.size <= 10485760){ // если в массиве нет файла с таким именем и размер файла не более 10 МБ, то

var reader = new FileReader(); //читаем файл
reader.onload = function(e){
files[file['name']] = base64_encode(e.target.result); //кодировка файла
$('.combineLoaded').append('<div class="readUploadedFile ovh posr"><div class="loadedImageName"><div class="fileName posr boxs ovh" title="'+ file['name'] +'">'+ file['name'] +'</div></div><img src="'+event.target.result+'" alt="'+ file['name'] +'" title="'+ file['name'] +'"></div>'); //в div вставим имя файла и превью, кстати как можно обрезать превью на jQuery?
};
reader.readAsDataURL(file); // тип чтения файлов
}
else{
$('.totalPhotos span').css('color', '#ff0000').text('0'); // если оба условия не верны, то
files = {}; //очищаем массив
theInputFile.val(''); //очищаем инпут
$('.combineLoaded').empty(); //очищаем div с превью файлов
$.jGrowl('Одна или несколько фотографий превышают лимит - 10 МБ'); //выводим сообщение
return false; // отменяем все
}

//end each
});
}

else{ // а если юзер выбрал более 3-ёх изображений, то
$('.totalPhotos span').css('color', '#ff0000').text('0'); // пишем 0 в кол-во выбранных файлов
files = {}; // очищаем массив
theInputFile.val(''); // очищаем инпут
$('.combineLoaded').empty(); // очищаем div 
$.jGrowl('Не более 3-ёх фотографий разрешено для загрузки.');//выводим сообщение о внимательности
return false; // останавливаем все
}

});
}

Суть проблемы - в проверке каждого файла. То есть, если хоть один файл не совпадает под условие if(!files[file['name']] && file.size <= 10485760){
То он не загрузится и не отобразится в превью, но все остальные выбранные файлы загрузятся и отобразятся в превью. Как переписать условие так чтобы если хоть один файл не попал под условия, то дальше очистить все и больше не загружать ничего?

Answer 1

[Вадим]

Не совсем понятно откуда очистить?

И вот тут вопрос:

var files = {}; // тут хранятся файлы
// ...
files = {}; // сначала очистим массив, так как юзер может перезагрузить файлы n раз

Так массив или объект?

А так, если files у Вас всё же массив, то:

var isSomeFileTooBig = this.files.some(function(file){ return file.size > 10485760 })
if(isSomeFileTooBig) return;

А если объект, где названия файлов - его свойства, а файлы - значения, то можно так:

var isSomeFileTooBig = Object.values(this.files).some(function(file){ return file.size > 10485760 })
if(isSomeFileTooBig) return;

Comments

[Сергей Миллер]

Спасибо за Ваше внимание, возвращается ошибка this.files.some is not a function

[Сергей Миллер]

files - массив

[Сергей Миллер]

Спасибо, разобрался!!! Помогли очень. Спасибо за то, что поделились опытом.