html 在线显示文件大小,HTML5如何判断文件大小

一、HTML5前端判断文件大小

data-max_size="8388608" οnchange="angular.element(this).scope().startUpload(event)">

//上传文件 action

$scope.startUpload = function(myevent){

//检查文件大小

var target = myevent.target;

var currentObj = $(target);

var fileSize = parseInt(currentObj.attr("data-max_size"));

var inFactFileSize = target.files[0].size;

if(inFactFileSize > fileSize){

tipService.alert({

title:"提示!",

template:"上传文件不能超过8M",

callback:function(){

}

});

return false;

}

$ionicLoading.show({

template: 'Loading...'

});

entrustSellService.uploadFileAction($scope);

};

在js事件中，event对象通过 event.files[n]访问具体的file对象，可以通过该对象获取file文件相关的属性(大小、文件格式、修改日期等属性)。

二、利用后台判断上传文件大小(兼容早期浏览器)

在submit之后，浏览器会发送http请求给后台，http头部包含向服务器提交数据的大小，如图所示

后台在第一次获取到数据流的时候，先判断http头部，如果不满足上传文件的大小，则终止数据流，减少流量。