Як перевірити, чи вхідний файл порожній у jQuery

101

Зовсім нове для JS.
Я намагаюся перевірити, чи порожній елемент введення файлу, подаючи форму за допомогою jQuery / JavaScript. Я пережив купу рішень, і нічого для мене не працює. Я намагаюся уникати /c/fakepath(якщо немає іншого варіанту)

<input type="file" name="videoFile" id="videoUploadFile" />

Це не працює:

var vidFile = $("#videoUploadFile").value;

Єдиний спосіб отримати ім’я файлу - це якщо я використовую наступне:

var vidFile = document.getElementById("videoUploadFile").files[0].name;

Якщо файлу немає, код видає помилку:

не вдається прочитати ім'я властивості undefined

що має сенс, оскільки масив не встановлено. але я не можу зрозуміти, як зробити будь-яку обробку помилок з цим.

Як правильно схопити елемент введення файлу videoUploadFile, перевірити, чи він порожній, вивести повідомлення про помилку, якщо він порожній?

javascript jquery html

— користувач3753569
джерело

7

Перевірити .files.length?

— Teemu

5

Чому хтось голосував проти цього питання? Я іноді так не розумію. Я проголосував за вас назад до 0.

— Seano666

Ви також можете відфільтрувати непорожні файли, якщо у вас більше одного у формі:var files = $('#formbody').find('input[type=file]').filter(function() { return $(this)[0].files.length > 0; });

— Piotr Kowalski

177

Просто перевірте властивість довжини файлів , яка є об'єктом FileList, що міститься в елементі введення

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

— Патрік Еванс
джерело

1

( document.getElementById("videoUploadFile").files.length === 0 )

— Pathros

140

Ось його версія jQuery:

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

— Салім
джерело

1

Ця відповідь є більш доречною, оскільки ОП запитувало рішення JQuery.

— Хуссейн Акбар,

$('#videoUploadFile').get(0)те саме, $('#videoUploadFile')[0]але, можливо, get()робить деякі перевірки

— розумності

18

Щоб перевірити, чи вхідний файл порожній чи ні, за допомогою властивості довжини файлу, indexслід вказати наступне:

var vidFileLength = $("#videoUploadFile")[0].files.length;
if(vidFileLength === 0){
    alert("No file selected.");
}

— Мамун
джерело

3

Запитання: як перевірити Файл порожній чи ні?

Відповідь: У мене є проблема з цим кодом Jquery

//If your file Is Empty :     
      if (jQuery('#videoUploadFile').val() == '') {
                       $('#message').html("Please Attach File");
                   }else {
                            alert('not work');
                   }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="file" id="videoUploadFile">
<br>
<br>
<div id="message"></div>

Розгорніть фрагмент

— Аднан Лімдівала
джерело

1

Подальше пояснення того, чому це могло би спрацювати або що було неправильним у вихідному питанні, допомогло б підвищити якість цієї відповіді.

— Джош Берджесс,

@josh burgess ця відповідь полягала в тому, як перевірити, чи файл порожній чи ні, - це ще один спосіб перевірити файл, коли ви подаєте форму за допомогою jquery.

— Аднан Лімдівала

@JoshBurgess ОП запитує, як це зробити в jQuery. У всіх інших відповідях використовуються ванільний JS або комбінований JS та jQuery. Це єдиний, хто використовує виключно jQuery. Можливо, я вибагливий, але мені не подобається змішувати jQuery з ванільним JS, якщо мені це не потрібно.

— Едуард Лука

Відповідь @EduardLuca старше двох років. У той час це було позначено як низькоякісне. Пояснення коду, як правило, оцінюється спільнотою SO, і коментар мав на меті корисне нагадування не просто про поштовий індекс, а для пояснення того, що таке код і чому він працює. Сподіваюся, це допоможе прояснити ситуацію.

— Джош Берджес,

3

Я знаю, що запізнююсь на вечірку, але думав додати те, що в результаті використав для цього - а саме, щоб просто перевірити, чи не містить вхідні дані файлу неправдиве значення з оператором not & JQuery приблизно так:

if (!$('#videoUploadFile').val()) {
  alert('Please Upload File');
}

Зверніть увагу, що якщо це форма, можливо, ви також захочете обернути її наступним обробником, щоб запобігти подачі форми:

$(document).on("click", ":submit", function (e) {

  if (!$('#videoUploadFile').val()) {
  e.preventDefault();
  alert('Please Upload File');
  }

}

— Джоель Янгберг
джерело