JQuery'de giriş dosyasının boş olup olmadığı nasıl kontrol edilir


105

JS'de yepyeni.
Formu jQuery / JavaScript ile gönderirken dosya giriş öğesinin boş olup olmadığını kontrol etmeye çalışıyorum. Bir sürü çözümden geçtim ve hiçbir şey benim için çalışmıyor. Kaçınmaya çalışıyorum /c/fakepath(başka bir seçenek yoksa)

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

Bu çalışmıyor:

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

Dosya adını alabilmemin tek yolu, aşağıdakileri kullanmamdır:

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

Kullanılabilir dosya yoksa, kod bir hata verir:

tanımsız özellik adı okunamıyor

bu mantıklıdır çünkü dizi ayarlanmamıştır. ancak bununla herhangi bir hata işlemeyi nasıl yapacağımı çözemiyorum.

Dosya giriş öğesini nasıl düzgün bir şekilde yakalayabilirim, videoUploadFileboş olup olmadığını kontrol edebilirim, boşsa bir hata mesajı verebilirim?


7
Kontrol etmek .files.lengthmi?
Teemu

5
Neden birisi bu soruya olumsuz oy versin? Bazen SO anlamıyorum. Sizi tekrar 0'a
yükselttim.

Formda birden fazla dosya varsa boş olmayan dosyaları da filtreleyebilirsiniz:var files = $('#formbody').find('input[type=file]').filter(function() { return $(this)[0].files.length > 0; });
Piotr Kowalski

Yanıtlar:


186

Giriş öğesinde bulunan bir FileList nesnesi olan files özelliğini kontrol edin

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

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

145

İşte bunun jQuery sürümü:

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

1
OP bir JQuery çözümü istediğinden, bu cevap daha uygundur.
Hüseyin Ekber

$('#videoUploadFile').get(0)aynı $('#videoUploadFile')[0]ama belki get()bazı akıl sağlığı kontrolleri yapıyor
zanderwar

18

Dosya uzunluğu özelliğini kullanarak girdi dosyasının boş olup olmadığını kontrol etmek indexiçin aşağıdaki gibi belirtilmelidir:

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

4

Partiye geç kaldığımı biliyorum, ancak bunun için kullandığım şeyi ekleyeceğimi düşündüm - bu, dosya yükleme girişinin değil operatörü ve JQuery ile doğru bir değer içerip içermediğini kontrol etmektir:

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

Bu bir formdaysa, formun gönderilmesini önlemek için aşağıdaki işleyiciyle de sarmak isteyebileceğinizi unutmayın:

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

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

}

3

Sorular: Dosyanın boş olup olmadığı nasıl kontrol edilir?

Cevap: Bu Jquery kodunu kullanarak bu sorunu çözdüm

//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
Bunun neden işe yaradığına veya orijinal soruda neyin yanlış olduğuna dair daha fazla açıklama, bu cevabın kalitesini yükseltmeye yardımcı olacaktır.
Josh Burgess

@josh burgess bu cevap, jquery kullanarak form gönderirken dosyanızı kontrol etmenin başka bir yolu, dosyanın boş olup olmadığını nasıl kontrol edeceğidir.
Adnan Limdiwala

@JoshBurgess OP bunu jQuery'de nasıl yapacağını soruyor. Diğer tüm yanıtlar ya vanilya JS ya da JS ve jQuery kombinasyonunu kullanır. Bu, yalnızca jQuery'yi kullanan tek kişidir. Belki seçiciyim, ama gerçekten mecbur kalmadıkça jQuery'yi vanilya JS ile karıştırmayı sevmiyorum.
Eduard Luca

@EduardLuca Yanıt iki yaşın üzerinde. O sırada düşük kaliteli olarak işaretlendi. Kodun bir açıklaması genel olarak SO topluluğu tarafından beğenilir ve yorum, yalnızca posta kodu için değil, kodun ne olduğunu ve neden çalıştığını açıklamak için yararlı bir hatırlatma olarak düşünülmüştür. Umarım bu işleri açıklığa kavuşturmaya yardımcı olur.
Josh Burgess

0
  $("#customFile").change(function() { 
    var fileName = $("#customFile").val();  

    if(fileName) { // returns true if the string is not empty   
        $('.picture-selected').addClass('disable-inputs'); 
        $('#btn').removeClass('disabled');   
    } else { // no file was selected 
      $('.picture-selected').removeClass('disable-inputs'); 
      $('#btn').addClass('disabled');
    }  
  });

Yazınıza yorum eklemeniz gerektiğini düşünüyorum.
AbdurrahmanY
Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.