Klient Sprawdzanie rozmiaru pliku przy użyciu HTML5?

Question

Próbuję przejechać się na fali HTML5, ale mam do czynienia z małym problemem. Przed HTML5 sprawdzaliśmy rozmiar pliku z lampą błyskową, ale teraz trendem jest unikanie używania flasha w aplikacjach internetowych. Czy istnieje sposób sprawdzania rozmiaru pliku po stronie klienta przy użyciu HTML5?

Answer 1

To działa. Umieść go w detektorze zdarzeń, gdy zmieni się dane wejściowe.

if (typeof FileReader !== "undefined") { 
    var size = document.getElementById('myfile').files[0].size; 
    // check file size 
} 

Answer 2

"no proste rozwiązanie cross-browser do osiągnięcia tego celu": Detecting file upload size on the client side?

Answer 3

HTML5 fie api służy do sprawdzania rozmiaru pliku.

przeczytać ten artykuł, aby uzyskać więcej informacji na temat plików api

http://www.html5rocks.com/en/tutorials/file/dndfiles/

<input type="file" id="fileInput" /> 


var size = document.getElementById("fileInput").files[0].size; 

podobnie złożenia API daje nazwę i typ.

Answer 4

Uploadify może przesyłać pliki z HTML5. Istnieje również wersja flash.

Możesz ustawić ograniczenia rozmiaru pliku, używając parametru "fileSizeLimit".

Answer 5

Przyjęta odpowiedź jest w rzeczywistości poprawna, ale należy ją powiązać z detektorem zdarzeń, aby była aktualizowana po zmianie danych wejściowych.

document.getElementById('fileInput').onchange = function(){ 
    var filesize = document.getElementById('fileInput').files[0].size; 
    console.log(filesize);  
} 

Jeśli używasz biblioteki jQuery następnie następujący kod może się przydać

$('#fileInput').on('change',function(){ 
    if($(this).get(0).files.length > 0){ // only if a file is selected 
    var fileSize = $(this).get(0).files[0].size; 
    console.log(fileSize); 
    } 
}); 

Zważywszy, że konwersja Wielkość pliku do wyświetlenia w którym kiedykolwiek metryka jest do ciebie.

Answer 6

Osobiście wybrałbym tego formatu: Walidacja

$('#inputFile').bind('change', function(e) { 
     var data = e.originalEvent.target.files[0]; 
     // and then ... 
     console.log(data.size + "is my file's size"); 
     // or something more useful ... 
     if(data.size < 500000) { 
     // what your < 500kb file will do 
     } 
    }