ไคลเอนต์ตรวจสอบขนาดไฟล์โดยใช้ HTML5?

ฉันกำลังพยายามขี่คลื่น HTML5 แต่กำลังประสบปัญหาเล็กน้อย ก่อน HTML5 เรากำลังตรวจสอบขนาดไฟล์ด้วยแฟลช แต่ตอนนี้แนวโน้มคือการหลีกเลี่ยงการใช้แฟลชในเว็บแอป มีวิธีใดในการตรวจสอบขนาดไฟล์ในฝั่งไคลเอ็นต์โดยใช้ HTML5 หรือไม่?

นี้ได้ผล วางไว้ในตัวฟังเหตุการณ์เมื่ออินพุตเปลี่ยนไป

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

คำตอบที่ยอมรับนั้นถูกต้องจริง แต่คุณต้องเชื่อมโยงกับตัวฟังเหตุการณ์เพื่อให้อัปเดตเมื่อมีการเปลี่ยนแปลงอินพุตไฟล์

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

หากคุณใช้ไลบรารี jQuery รหัสต่อไปนี้อาจมีประโยชน์

$('#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);
  }
});

ระบุว่าการแปลง fileSize เพื่อแสดงเมตริกที่เคยขึ้นอยู่กับคุณ

HTML5 fie api รองรับการตรวจสอบขนาดไฟล์

อ่านบทความนี้เพื่อรับข้อมูลเพิ่มเติมเกี่ยวกับ file api

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

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


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

ในทำนองเดียวกัน file API ให้ชื่อและประเภท

โดยส่วนตัวแล้วฉันจะเลือกใช้รูปแบบนี้:

    $('#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
      }
    }

"ไม่มีวิธีแก้ปัญหาข้ามเบราว์เซอร์ที่เรียบง่ายเพื่อให้บรรลุเป้าหมายนี้": กำลังตรวจหาขนาดไฟล์ที่อัปโหลดในฝั่งไคลเอ็นต์?